[...] Click here for a vertical flyout version of this menu. [...]

Mr. Leigeber,
You are so in control you are out of control!

Great job. Very nice. I appreciate its low foot print. As soon as I get this up I will be happy to let see your work in action…. domo. p

Michael – quick question – how does the opacity work on this?
What if I don’t want the background color to reach “opacity: 1;” -
I tried setting it in the css but I think it has something to do with the “flyout.js”.

Anyways – great job and thanks… – so glad I found your blog

prob overlooking something really simple…but how would i make menu item #3 a link?

thanks!

[...] Vertical Flyout JavaScript Menu por Leigeber [...]

[...] Menú deslizante con efecto de aparición. [...]

Is there a vertical and horizontal menu combination? I need to implement a horizontal menu with the option of submenus to open vertically. Anyone come across that or know if it can be done with this menu?dropdown.js

Is there a vertical and horizontal menu combination? i try to combine them but unsuccessful.

[...] al menú, está hecho en JavaScript y es la hostia de simple. El copyright de todos modos es de Leigeber (si alguno lo quiere implementar en su web tiene que bajarse el pack en la web del autor y debe de [...]

Have you done a 3rd level of flyout? I am trying to get that, but am having some problems. Also, I am wondering about linking the main “button.”

Thank you for the menu!

Dear author,
Is it possible to create sub menu of sub menu.
For example:
1. Customer
1.1. New Customer
1.2. Edit Customer
1.3. Serach Customer
1.3.1. By Company
1.3.2. By By City

Awaiting of your quick reply.

IN above “@jenn – You might want to take a look at the original dropdown menu. ” (May 30 reply) … where do I find original dropdown menu so I can make menu item 3 a link without screwing up alignment.
(The updated website not online yet…due to problem with alignment of adding the a to menu items like 3….)…

Amazingly perfect.. and sooo easy to customize. Don’t change a thing!! Great job!

Is there a way to make the top level a clickable item? I have one item on my menu that doesn’t need any submenus, but can’t seem to figure out how to get the top level to act as a link.

OK. This may be “old school,” but it works. I made a style for an anchor tag, with the background set to a transparent .gif file, and then linked the menu item. The definition list still produces the fly-out, but now I also have a “button” with a link for the main menu selection.

Can you please let me know if it is possible to have a multicolumn version of the vertical dropdown?

Yes, i am presented with the same problem. I also get the grey menu link that extends outward. I redownloaded the demo, but it has not been updated i nthe zip file. I assume you edited the css file as well? I am kinda stuck at the moment.

ok, so changing the padding to 0px changes the flyout menu items as well, so rather don’t change it. Back to square one.

Actually just cracked it. I needed to have each preceding menu with a higher z-index in the container divs. So the left most menu’s zindex needs to be 4, the next 3 and so on. Don’t mind me – today has been a bit of a learning curve.

Thanks Again!

@ML – thanks very much for this, you’ve helped me out no end!!! I’m still learning this whole html/css malarky so still having a few teething problems.
Whats the div id “wrapper”? is it essential for this to work?
I’m using this in a shared php so only the right hand column will show this on every page. I need it to be 140px wide so the main body text for all the other pages will align at the top. At the moment the main body starts underneath where the drop down menus finish, so i’m wondering if the “wrapper” is in the way.
I hope i’m making sense explaining this!!! Can you help?
Many thanks, Sami

@ML
OK i’m stuck again!!
I have 4 menu buttons listed with horizontal pop up menus. Ive managed to change the layout to what i want but i want one of them to be a different colour to the others and the pop up to different colour aswell. I’ve tried making a new setting but either nothing changes or the the colour does change but the pop up menu appears underneath instead of to the right.
How can i change this?

Thank, Sami

[...] Vertical Flyout JavaScript Menu [...]

I have used your code…THANKS!…but I have had to modify it a little bit and it doesn’t exactly look like the pretty buttons you have on your page, but I was more interested in the cool fade in type drop down effect than the buttons, what I have will work for me. I do not have this page up as of yet for you to see, but do have a question. Frequently I must change the information in the drop down box to link to different places, the site I am wanting to use it on has at least 15 pages which means the way that this is set up, I have to edit 15 pages every time something changes. Is there a way to make an external sheet to link to for the link information? If so could you show me how? THANK YOU

Hi! This is a great flyout menu! I’m wondering if you’d got any further with the wordpress plugin idea (original query by Bill). I’d love to use it in a site for my father-in-law.
Thanks!

great script… would it be difficult to modify so the flyout menus appear on the left side? i’d love to work this into a hebrew site i’m building…

cheers

Great.. i tried something similar with CSS2 but it was not not this smooth effect.. this one is awesome !!!.. thanks

Hey!, really nice script. Thanks for giving if for free. Greetings from Mexico.

excellent work, thank’s for you contribution.

[...] Vertical Flyout JavaScript Menu [...]

Hello all. Thanx for the great menu!
Does anyone know how to put a link to the menu item three (the one with no sub category)?
Thanx again!

OK, I know this is kind of novice, but how do I create a clean looking link from the main menu without a flyout?

Thanks much!

This is awesome, anyway I can change all the parent sides be links in addition to the flyouts? If not, at least change “Menu Item 3″ to be a link would be fantastic.

Super, great stuff. Thanks

[...] 7. Vertical Flyout JavaScript Menu; [...]

Thanks so much! This an awesome piece of work; too good to be free!

Thanks again, from South Africa.

Re: Vertical Flyout JavaScript Menu
Per the example how would you make dropdown four link to another website?
When adding the “href” my style comes out as the flyouts not as the main menu.

Hi, very nice Menu and a big thx for the free use!!!
I wished a second level, but its not soo important.
Thank u very much.

ratsplayer

Sorry…should have added IE 7 and Firefox 3.0.5. Any assistance would be much appreciated. Thanks for what you do.

hi again, in addition to my last post:
in IE the fade effect does’t occur at the first mouseover over a menu link, Then the submenu is just there. At the second mouseover the fade effect does occur. This happens everytime after i refresh the page. Could anyone help me out?

Hi,

Awesome script, exactly what i’ve been looking for. I’m looking to use the slideup version of this menu, but am struggling to see the difference in code between it and the dropdown version. Is anyone able to tell me where i should be looking and what code i should be changing? It’d be a massive help!

Thanks,
Neil.

This is an awesome menu; however, I am new to HTML and CSS. How do I put these files into Front Page??? I downloaded the files already and opened each one up in FP separately. How do I get this to work? Do I copy and paste all of this into one file? Please help. Thanks, TW

Im not very good with javascript, if I wanted each button to have its own image, and own roll over image, is there a way to do that?

Im facing the problem wat Peter faced. Menu works perfectly in firefox, however in IE7 the pop up layers keep appearing underneath the next column. I can’t find out whats causing it (Zindex possibly?).
And in the next comment he wrote that he has fixed the prob by changing the Zindex. And it doesnt work for me. Any help for the needy!!!!!!

did you ever manage to adapt this script so that it allowed a second level of flyout? Would really like to use this on a site, but need more than one level

[...] Click here for a vertical flyout version of this menu. [...]

[...] 7. Vertical Flyout JavaScript Menu; [...]

Hi there, great menu, very easy to use… except for one problem!….. It seems so easy but it wont go for some reason…. how can i change the width of the submenus? they dont seem to change no matter what i change on the css.

Thanks, great work

Hi there!
Firstly, Thank you Michael, I love all of your scripts, so light, so clean, you are a generous genius.
Second:
Here is a quick little work around I figured out for multiple sub levels on the flyout menu, I have noticed many people asking for this function, me being one of them.
Ok, here we go:
First, use Michael's drop down menu instead of the flyout menu, it is a little bit leaner/ easier to modify and I prefer it.
After you have downloaded the dropdown menu files, open up the style.css and make these changes.
1. On "ul.menu" simply add a width property, anything but 100% seems to work, I went with 100px, this forces the menu to line up vertically instead of horizontally.
2. On "ul.menu ul" change the "top:26px;" to 5px or 0px, this brings it up, also add "left:149px;", this pushes the original dropdown over to the side of the menu.
That's it! Now you have a flyout menu with as many sub levels as you desire. I've tested this in Mozilla as well as IE 6 and 7, seems to work just fine.
I know this is quite a rudimentary fix, but hey, it's simple and it works.
I hope this helps some of you out.
Keep up the good work Michael.