PDA

View Full Version : CSS drop down menu, horiz. buttons



Ejjman
10-20-2008, 11:06 PM
So the buttons are like this...



[Home][Facts][Contact]

something of that sort, and I don't want to actually post the site. But anyway, I want to on mouse over the facts to create a vertical drop down of items in a nice looking way.

I'm beginner to CSS and Javascript, but I think it shouldn't be super hard.

Thanks.
-Ejj

Dan Cardin
10-20-2008, 11:31 PM
Very googleable.

For dropdown - http://javascript-array.com/scripts/simple_drop_down_menu/#
And afaik for the sideways menu you make an unordered list and do "float: left" to get it to be horzontal.
:)

TravisV10
10-21-2008, 12:04 AM
Dude Javascript is for drop down menus. They are complex so dont bother. Use a premade one

ebk forever
01-13-2009, 02:54 PM
Umm they are not complex?? thats like really basic nooby JS?

Floor66
01-13-2009, 03:03 PM
They are NOT COMPLEX AT ALL!


<html>
<head>
<script type="text/javascript">
function drop_down(item_number)
{
var obj = document.getElementById('item'+ item_number);
if (obj.style.display == "block")
{
obj.style.display = "none";
}
else
{
obj.style.display = "block";
}
}
</script>
</head>
<body>
<div id="menu">
<a href="javascript:drop_down('1');" onMouseOver="drop_down('1');" onClick="drop_down('1');">[mouse me over]</a>
<div id="item1" style="display: none;" onMouseOut="drop_down('1');">
<a href="#">Link 1</a><br />
<a href="#">Link 2</a><br />
<a href="#">Link 3</a><br />
<a href="#">Link 4</a><br />
</div>
</div>
</body>
</html>


Correct me if I'm wrong.

Craig`
07-14-2009, 02:22 PM
Sorry, this is bumping an old thread, but it's just so that if anyone else looks at it, then they'll have an answer.
The best way to accomplish the _is_ to use javascript, but I would suggest using jQuery, search youtube for jQuery and then one of DetachedDesigns videos does exactly what you want ;]

note: - I chose jQuery because of it's absolute ease, it's really cool