Hello,
I’ve got a problem that I can’t solve. I’ve set up a testpage: http://www.insiderwetten.com/You can see a link in the navigation line called Sample Page. If you hover it, a submenu (ul) appears. But in IE9 the submenu is hidden by every other DIV , even if I would set the submenu above the navigation line.
I tried a lot with disabling overflow:hidden and z-index but couldn’t get a solution.
The popup is done with this jquery code (the disable function is missing at the moment):
$('#navigation ul li',this).hover(function() {
$(this).find(".sub-menu").css("display","block");
}, function() {
});
Do you have an idea or could get a solution with firebug e.g.
Thanks a lot.
- Author was Featured
- Bought between 100 and 499 items
- Bulgaria
- Exclusive Author
- Has been a member for 2-3 years
- Item was Featured
- Microlancer Beta Tester
- Referred between 200 and 499 users
header { position: relateve; z-index: 3;}
toppicture { position: relateve; z-index: 2;}
main-content { position: relateve; z-index: 1;}
Give them a relative position. That would give you the opportunity to assign a z-index to each of the containers and make sure the header is ABOVE the other divs. However, your structure is a bit strange and the overlap is not the biggest concern.
This is wrong way to do the dropdown menu.
1) Your jQuery code is too primitive, users will have many problems with such menu;
2) It can easilty work without JS, with CSS hover;
3) If you want an effect, you can add popular jQuery Superfish plugin, or use CSS3 effects.
You can use this template as an example.
ok thanks.
I used a code example from the net and the navigation menu was one of the first things I’ve implemented in my theme. Maybe I’ll build my own now or use Superfish. thanks
Superfish works great!
