Hola
lo que necesito es dejar el primer item del menu desplegado (en este caso Codes Samples), el codigo lo baje de
http://www.getelementbyid.com/ y aparece un demo .
ademas les dejo el codigo completo porsi a algien mas lo quiere usar
Código PHP:
<html>
<head>
<title>Switch Menu</title>
<style type="text/css">
.menuOut {cursor:pointer; margin:7px; background-color:#0099cc; color:#000000; width:140px; border:1px solid #000000; padding:2px; text-align:center; font-weight:bold;}
.menuOver {cursor:pointer; margin:7px; background-color:#000000; color:#0099cc; width:140px; border:1px solid #0099cc; padding:2px; text-align:center; font-weight:bold;}
.submenu {width:170px; font-family:Verdana; font-size:12px; padding-left:25px;}
.submenu a {color:#336699; text-decoration:none; font-weight:bold;}
.submenu a:hover {color:#ff0000; text-decoration:none; font-style:oblique; font-weight:bold;}
</style>
<script type="text/javascript">
/*
Script made by Martial Boissonneault © 2001-2003 [url]http://getElementById.com/[/url]
This script may be used and changed freely as long as this msg is intact
Visit [url]http://getElementById.com/[/url] for more free scripts and tutorials.
*/
function SwitchMenu(obj){
if(document.getElementById){
var el = document.getElementById(obj);
var ar = document.getElementById("cont").getElementsByTagName("DIV");
if(el.style.display == "none"){
for (var i=0; i<ar.length; i++){
ar[i].style.display = "none";
}
el.style.display = "block";
}else{
el.style.display = "none";
}
}
}
function ChangeClass(menu, newClass) {
if (document.getElementById) {
document.getElementById(menu).className = newClass;
}
}
document.onselectstart = new Function("return false");
</script>
</head>
<body>
<div id="cont">
<p id="menu1" class="menuOut" onclick="SwitchMenu('sub1')" onmouseover="ChangeClass('menu1','menuOver')" onmouseout="ChangeClass('menu1','menuOut')">Codes Samples</p>
<div class="submenu" id="sub1" style="display:none;">
• <a href="#" title="Scrolling Text">Scrolling Text</a><br/>
• <a href="#" title="Static Ticker">Static Ticker</a><br/>
• <a href="#" title="Zoom Intro">Zoom Intro</a>
</div>
<p id="menu2" class="menuOut" onclick="SwitchMenu('sub2')" onmouseover="ChangeClass('menu2','menuOver')" onmouseout="ChangeClass('menu2','menuOut')">Tutorials</p>
<div class="submenu" id="sub2" style="display:none;">
• <a href="#" title="InnerHTML">InnerHTML</a><br/>
• <a href="#" title="Document Size">Document Size</a>
</div>
<p id="menu3" class="menuOut" onclick="SwitchMenu('sub3')" onmouseover="ChangeClass('menu3','menuOver')" onmouseout="ChangeClass('menu3','menuOut')">Help Forum</p>
<div class="submenu" id="sub3" style="display:none;">
• <a href="#" title="Javascript">Javascript</a><br/>
• <a href="#" title="DHTML">DHTML</a><br/>
• <a href="#" title="Off-topic">Off-topic</a>
</div>
<p id="menu4" class="menuOut" onclick="SwitchMenu('sub4')" onmouseover="ChangeClass('menu4','menuOver')" onmouseout="ChangeClass('menu4','menuOut')">Cool Links</p>
<div class="submenu" id="sub4" style="display:none;">
• <a href="#" title="Google">Google</a><br/>
• <a href="#" title="Altavista">Altavista</a><br/>
• <a href="#" title="Yahoo">Yahoo</a><br/>
• <a href="#" title="Lycos">Lycos</a>
</div>
<p id="menu5" class="menuOut" onclick="SwitchMenu('sub5')" onmouseover="ChangeClass('menu5','menuOver')" onmouseout="ChangeClass('menu5','menuOut')">Contact Us</p>
<div class="submenu" id="sub5" style="display:none;">
• <a href="#" title="Email">Email</a><br/>
• <a href="#" title="Location">Location</a>
</div>
</div>
</body>
</html>