Well I’ve been at it again looking at new ways in which I can make good use script.aculo.us effects. I started by looking at the accordion this time and ways in which it can be developed to produce different results. The most common example that I knew of was the Rico accordion, so that’s where I decided to start.
As you can see below it looks quite cool and can add some nice interaction to any site. At this stage, however, I’m not going to write too much about the code behind it as I am still working on it but I thought it may be interesting for people to have a look at.
browser list
Currently the tab slide has been tested in Fixefox 2.0, Internet Explorer 7 – 6, Opera 9 and Safari 3. I am planning to test this more rigorously, however, as I stated above there is still more work required before I prepared to say it is complete.
demo
Please use the Fancy Sliding Tab Menu using scipt.aculo.us demo, have a play and let me know what you think.
code
Please download Fancy Sliding Tab Menu using scipt.aculo.us code and use it to your hearts desire.
todo
- Check accessibility
- Degrade without JavaScript
- Further browser tests
17 Comments Received
How can you set it up so that the menu reverts back to its normal state, after it has been popped up? I’ve looked at the downloadable files in IE7 and FF2 — and it works fine between the hovering over the various tabs — but how do you make the current tab slide back down automatically, after you move away from the menu? Right now, the tab remains up even after the hover state. I’d really like to integrate this into my site, so any help would be much appreciated =)
Hi Andrew, fantastic menu! One more step to get the flash rid of our lifes LOL =)
I’d like to ask u the same think as the gentlemen above did, to make the current tab slide back down on the mouse out.
Thanks! Cheers mate!
I’m currently working on a version with an idle state implemented. After say 30 seconds of non mouse movement over the menu it will contract all the tabs.
I’ll post it here soon when it’s complete.
Thanks
Andy
Your menu really rocks Andy, can’t wait for improved version with the auto contract item
Hi All,
Just to let you know I have updated the menu with an idle state that will auto contract the menu when there is no mouse movement for a defined period. Have a look for yourself at http://www.andrewsellick.com/64/fancy-sliding-tab-menu-v2.
Cheers
Andy
Hay dude, nice job.. keep it up.
I really like the menu, but I don’t have extension/program to open a .rar file. Is there anyway to get this in zip format?
Thanks,
Serena
Hi Serena,
Simply download and install Winrar (http://www.win-rar.com/). This will then allow you to extract the files.
Sir,
thanks for ur source code and help to me. i am really greatefull to you.
if any suggetion for imporving that source code then i will post you.
thanks.
thank u
i noticed a slight bug in the slide menu demo. Onced closed the menu would pop back out very quickly (if you blink u miss it) have you got a horizontal example?
Hi Men! Excellent Menu! I was looking for some like this for a long time till I found this! The only thing is that i need the same thing but upside down. Put the menu on the top on the page and open the tabs below the menu. Thanxs!!
Pingback & Trackback
Leave A Reply