Dropdown menu when a button is clicked

[MichaelRoe]

Ok, so since it seems that this forum is such a great place to get help with scripting, and hopefully I could be a regular user here, I'm going to start coming here to get solutions to my noob problems

Anyway, I'm having trouble with drop down menus.

I want something similar to the 'User Controls' bar we have here, where you can put your mouse over a button and it will come up with a div where I can store even more buttons. However, instead of having this happen on the event of the mouse going over the button, I would like it to happen when the mouse clicks on the button.

Does anyone have a code for this?

[Ronald Roe]

http://www.cssplay.co.uk/menus/csspl...p-fly.html#url

Try that

[MichaelRoe]

Thanks

Looks like a good exampe

I'm getting the code now

[christopher_b]

the best way is to use jquery for events to happen, and to make the event happen smoothly.
For example.

$("a.button").click(function(){
    $(div.show).show(200);
});

What that code does is, when you click on a.button the div.show will show with a nice slide effect, that's what the 200 is for...or you can use fadeIn instead of show..

To make the div dissapear when you no longer want to see it...you can do something like this.

$("a.button").click(function(){
    $(div.show).show(200);

    $("div.show").mouseout(function(){
        $(div.show).hide(200);
    });
});

How much do you know about html and javascript?

[Ronald Roe]

The only problem with your solution is that people with JS off have no navigation whatsoever. Usually I don't pander to that crowd, but basic site functions should work without JS. Perhaps a fallback? A CSS-based solution wrapped in a <noscript>?

[christopher_b]

Good point Ronald, a 'JavaScript off' detection would be needed here. to determine what should be used.