Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

JQuery DDMenu

I did a DropDownMenu. It works on hover. But there's a problem: when there's an image under the unfolded menu and i go down with my mouse to select the item i want, it sees that image under the menu and folds my menu back, so i can't really use it. See picture. http://s017.radikal.ru/i435/1408/11/afb0a5c577c6.jpg <a target="_blank" href="http://www.radikal.ru"><img src="http://s017.radikal.ru/i435/1408/11/afb0a5c577c6.jpg" ></a>

This is jquery i've used:

$(document).ready(function () {
$('#nav li').hover( function () { $('ul', this).show(300);
}, function () { $('ul', this).hide(200); });

});

2 Answers

Paul Brophy
Paul Brophy
10,673 Points

Hey Slavik,

It's hard to see what's going on here without code, but I suspect that this is something to do with z-index.

My approach to making dropdown menus is to make it in CSS first and then apply JavaScript afterwards, which can help to debug in these situations.

I've tried z-index. It is on top of the pictures, but somehow the cursor also "feels" the picture under menu and that causes the trouble