0

I have created a menu using js and css. Each li in the top level ul has a specific background image also a specific onmouseover image.

Everything is working fine, EXCEPT the onmouseover background whenever I have a submenu under it. Please check the vertical menu under the following link: http://www.balouta.com/Autostar3/testmenu/test.html

The Javascript used is the following:

var menuids=new Array("verticalmenu")
var submenuoffset=0 

function createcssmenu(){

for (var i=0; i<menuids.length; i++){
  var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul")
    for (var t=0; t<ultags.length; t++){

    ultags[t].parentNode.onmouseover=function(){ 

    this.getElementsByTagName("ul")[0].style.right=this.parentNode.offsetWidth+submenuoffset+"px"
    this.getElementsByTagName("ul")[0].style.display="block"

    }
    ultags[t].parentNode.onmouseout=function(){
    this.getElementsByTagName("ul")[0].style.display="none"
    }
    }
  }
}


if (window.addEventListener)
window.addEventListener("load", createcssmenu, false)
else if (window.attachEvent)
window.attachEvent("onload", createcssmenu)

1 Answer 1

2

The problem is that your hover over a top level menu displays a div(sub menu) that hides the content of top menu beneath so no hover for a (of top menu ) is triggered .

A small fix would be to remove the width for the items that have submenu.

remove the following line : width: 225px; (line 81) in the css

Do the same for all the other menus that has submenu.

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.