mouseover effect moet blijve bestaan bij submenu

Status
Niet open voor verdere reacties.

looije

Gebruiker
Lid geworden
2 apr 2002
Berichten
203
Beste mensen,

Na veel gestoei heb ik een mooi menu met submenu. Ook nog wat mooie mouseover effecten. Nu is de vraag, is het mogenlijk de mouseover van het menu item "foto" te laten bestaan zolang je in het submenu zit, dus "2009, 2008, 2007".

HTML:
 <div id="menubalk">
  <div id="menuleft"></div>
  <div id="menu">

   <ul id="nav">
    <li><a href="#"><img src="images/home.jpg" onMouseOver="this.src='images/home_over.jpg'" onMouseOut="this.src='images/home.jpg'"></a></li>
    <li><a href="#"><img src="images/forum.jpg" onMouseOver="this.src='images/forum_over.jpg'" onMouseOut="this.src='images/forum.jpg'"></a></li>
    <li><a href="#"><img src="images/foto.jpg" onMouseOver="this.src='images/foto_over.jpg'" onMouseOut="this.src='images/foto.jpg'"></a>
     <ul>
      <li><a href="#"><img src="images/2009.jpg" onMouseOver="this.src='images/2009_over.jpg'" onMouseOut="this.src='images/2009.jpg'"></a></li>
      <li><a href="#"><img src="images/2008.jpg" onMouseOver="this.src='images/2008_over.jpg'" onMouseOut="this.src='images/2008.jpg'"></a></li>
      <li><a href="#"><img src="images/2007.jpg" onMouseOver="this.src='images/2007_over.jpg'" onMouseOut="this.src='images/2007.jpg'"></a></li>
     </ul>
    </li>
   </ul>

  </div>
 </div>

de css
Code:
#nav, #nav ul	{ padding: 0px;
		  margin: 0px;
		  list-style: none; }

#nav li		{ float: left;
		  width: 140px; }

#nav ul		{ position: absolute;
		  width: 140px;
		  left: -1000px; }

#nav li:hover ul, #nav li.ie_does_hover ul { left: auto;
		                            background-position: 0px;
			            margin: -3px 0px 0px 19px; }

#nav a		{ display: block; }

js voor ie
Code:
sfHover = function() {
  var sfEls = document.getElementById("nav").getElementsByTagName("LI");
  for (var i=0; i<sfEls.length; i++) {
    sfEls[i].onmouseover=function() {
      this.className+=" ie_does_hover";
    }

    sfEls[i].onmouseout=function() {
      this.className=this.className.replace(new RegExp(" ie_does_hover\\b"), "");
    }
  }
}

if (window.attachEvent) window.attachEvent("onload", sfHover);

ik hoop dat het kan zonder al te veel ingewikkelde dingen, zelf kom ik er niet uit
 
Ik heb het nog niet uitgeprobeerd maar ik denk dat ik met GetElementById een eind moet komen. Ik laat het weten als het gelukt is.
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan