Page 1 of 1
CSS/Javascript Menu
Posted: Fri Dec 02, 2005 5:32 pm
by Smackie
Hello i am looking for a CSS/Javascript menu where you can click and it will slide down and have more chooses like this menu on this site
http://www.seawolves.org/ssn/
i know the codes i dont know the CSS part im not really good with CSS right now been looking at a few sites on learning CSS but please someone help me
Thank you
Smackie
Posted: Mon Dec 05, 2005 7:11 pm
by wtf
Hi...
Not really a DOM expert but I'm trying. I hope this helps.
Code: Select all
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script language="javascript">
var lastOpen = "undefined";
function showOptions(e) {
if(lastOpen != "undefined") {
document.getElementById(lastOpen).style.display = "none"
}
document.getElementById(e).style.display = "block";
lastOpen = e;
}
</script>
</head>
<body>
<div id="a1">
<span onClick="showOptions('l1')">text 1</span>
<ul id="l1" style="display:none">
<li>item 1</li>
<li>item 1</li>
<li>item 1</li>
<li>item 1</li>
<li>item 1</li>
</ul>
</div>
<div id="a2">
<span onClick="showOptions('l2')">text 1</span>
<ul id="l2" style="display:none">
<li>item 1</li>
<li>item 1</li>
<li>item 1</li>
<li>item 1</li>
<li>item 1</li>
</ul>
</div>
<div id="a3">
<span onClick="showOptions('l3')">text 1</span>
<ul id="l3" style="display:none">
<li>item 1</li>
<li>item 1</li>
<li>item 1</li>
<li>item 1</li>
<li>item 1</li>
</ul>
</div>
<div id="a4">
<span onClick="showOptions('l4')">text 1</span>
<ul id="l4" style="display:none">
<li>item 1</li>
<li>item 1</li>
<li>item 1</li>
<li>item 1</li>
<li>item 1</li>
</ul>
</div>
</body>
</html>