Problem - Nivoslider sits on top of jquery dropdown in IE7

Arrgghhh!开发者_运维知识库 I have been having a serious problem with my jquery dropdown and my nivoslider in IE7. For some reason, the jquery dropdown sits behind the nivoslider in IE7. It works great in all other browsers but IE7. I know its a z-index issue, but I haven't found a good solution on my end yet. The website - www.ecologicalgroup.com. Any suggestions?

there's a great post by a web developer named vance lucas who helps write a Jquery function for fix the IE7 issues with z-index.

http://www.vancelucas.com/blog/fixing-ie7-z-index-issues-with-jquery/

basically pop that into any of your Jquery .js files and it prioritizes the Z-index correctly for IE7.

$(function() {
    var zIndexNumber = 1000;
    $('div').each(function() {
    $(this).css('zIndex', zIndexNumber);
    zIndexNumber -= 10;
});
});

Try giving your header a position relative and setting the z-index to a higher value than that of the nivo-slider.

#header{
    position: relative;
    z-index: 1000;
}