Saturday, June 13, 2009

Horizontal Accordeon Slide Tutorial

Live Preview
sorry guys...for not being able to post a new one back a litle busy these few days,but im back right now :D...of course with the new one :))

this time i will teach you to make a Horizontal accordeon slide....
acctualy i got this Tutorial after surfing in this cyber world hehehe ,and right now i will share it what i've got to you
see the screenshot above if you want to know what it is...and the Live Preview included of course ^.^,see it up there too.
Features :
* handle aligned to the left
* animation is opening and closing content at the same time
* event trigger is mouse over
* cycling every 10 seconds from 1 to 4 and than from 4 to 1
* new event will only be allowed, once the first animation completed

Ok Lets begin....

First Paste This Css Code, above this Code

» Click to show CSS Code - click again to hide... «

Now For the JavaScript,Paste This Code Below

<script src='' type='text/javascript'/>

<script src='' type='text/javascript'/>

<script src='' type='text/javascript'/>

<script src='' type='text/javascript'/>

NOTE:you see js file URL right?? I suggest you download that file and reupload to your filehosting ,because im not responsible if that file removed from my account

Now The Last Thing you need to do...
Paste This Script Below

» Click to show Script Code - click again to hide... «

NOTE:If in your Header already had a widget then paste the code after </div> tag
Change As Needed...Text With Blue Color is Image Url,Text With Red Color Is Title For The Content,And with green color is the slide content

Ok Guys Thats all...(huff really tired after this)
Thx To
See Other Tutorial
Object Dock Navigation
Tabslide Navigation
Spoiler And Code Tutorial


  1. tip keren sob.....semangat ya....

  2. makasih sob infonya...salam sukses slalu sob...bermanfaat

  3. @rae_zen & Sastrocaster

    Thx sob..makasih yah dah mw mampir n ninggalin pesen :D

    Ok Sob pasang aj dlu link q...tar konfirmasi lg ksini...tar lngsung aq psang koq :)

  4. mantaaaab sob blognya....
    aku ambil ya oleh-olehnya

  5. morning friend...$$$mile for you in today please visiting to my blog..ok

  6. @Agus
    Oke sob...monggo d ambil aj;;)

    siip win 8-}

    ok...just wait:D

  7. good morning, happy to run a successful activity always

  8. good. copying now for my future reference. thanks for this pal.

  9. nice blog.. thanks for yuor visiting me... succes forn u

  10. @Reality ,Hill,Rusli
    Thx Buddy;)

    ur welcome buddy:D

  11. infonya manfaat banget sob buat newbie kayak aku, makasih ya