[muzza41]

hey, iv got a drop down menu working fine, the main coding looks like this:

<style type="text/css">
.menutitle{
cursor:pointer;
margin-bottom: 0px;
background-color:#000000;
color:#BBBBBB;
width:140px;
padding:2px;
text-align:center;
/*/*/border:2px solid #000000;/* */
}

.submenu{
	margin-bottom: 0.5em;
	background-color:#000000;
	color:#BBBBBB;
	Width:140px;
	padding:2px;
	Border: 2px solid #000000;
	text-align:center;
	font-size:10px;
	font-family: "Times New Roman", Times, serif;
}
</style>

<script type="text/javascript">



var persistmenu="yes" 
var persisttype="sitewide"

if (document.getElementById){ 
document.write('<style type="text/css">\n')
document.write('.submenu{display: none;}\n')
document.write('</style>\n')
}

function SwitchMenu(obj){
	if(document.getElementById){
	var el = document.getElementById(obj);
	var ar = document.getElementById("masterdiv").getElementsByTagName("span");
		if(el.style.display != "block"){
			for (var i=0; i<ar.length; i++){
				if (ar[i].className=="submenu")
				ar[i].style.display = "none";
			}
			el.style.display = "block";
		}else{
			el.style.display = "none";
		}
	}
}

function get_cookie(Name) { 
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) { 
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}

function onloadfunction(){
if (persistmenu=="yes"){
var cookiename=(persisttype=="sitewide")? "switchmenu" : window.location.pathname
var cookievalue=get_cookie(cookiename)
if (cookievalue!="")
document.getElementById(cookievalue).style.display="block"
}
}

function savemenustate(){
var inc=1, blockid=""
while (document.getElementById("sub"+inc)){
if (document.getElementById("sub"+inc).style.display=="block"){
blockid="sub"+inc
break
}
inc++
}
var cookiename=(persisttype=="sitewide")? "switchmenu" : window.location.pathname
var cookievalue=(persisttype=="sitewide")? blockid+";path=/" : blockid
document.cookie=cookiename+"="+cookievalue
}

if (window.addEventListener)
window.addEventListener("load", onloadfunction, false)
else if (window.attachEvent)
window.attachEvent("onload", onloadfunction)
else if (document.getElementById)
window.onload=onloadfunction

if (persistmenu=="yes" && document.getElementById)
window.onunload=savemenustate

</script>

With the link coding like this...:

<div id="masterdiv">

	<div class="menutitle" onclick="SwitchMenu('sub1')">Home</div>
  <span class="submenu" id="sub1">
		- <a href="home.htm">Your Home</a><br>
		- <a href="www.myspace.com">Myspace</a>
	</span>
	
	<div class="menutitle" onclick="SwitchMenu('sub2')">Friends</div>
	<span class="submenu" id="sub2">
		- <a href="add.htm">Add</a><br>
		- <a href="view.htm">View</a>
	</span>

	<div class="menutitle" onclick="SwitchMenu('sub3')">Pictures</div>
	<span class="submenu" id="sub3">
		- <a href="view.htm">View</a>
	</span>
	
	<div class="menutitle" onclick="SwitchMenu('sub4')">Contact</div>
	<span class="submenu" id="sub4">
		- <a href="comment.htm">comment</a><br>
		- <a href="message.htm">Message</a>
	</span>
</div>

I cant however find the piece of code within this that is telling each menu to be stacked upon each other horizontaly. Im after the menus to be spaced out verticaly so the menus drop down vertically to form a menu bar. Apart from that they work fine!

Any help would be much aprreciated!!

thanxs

neil,

This post has been edited by muzza41: 15 September 2006 - 05:07 AM

[coRPse]

not totally sure what you mean, I did something that sounds similar a while back and used this

if that's not what you wanted, there is a fantastic resource on dropdown lists at Listamatic which I used before. If not the answer, it's a good reference to start from.

[kenash88]

You know there is an HTML/CSS/Javascript section. Hopefully a moderator will move it for you if your question isn't already answered.