jquery.selectbox-0.2 issue with ie7 - dropdowns appearing behind elements instead of in front

javascript, jquery

Solution

You can use this solution using this little piece of jquery code, running on dom ready:

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

or try to fix the css z-indexing: http://web.enavu.com/snippets/fixing-the-ie7-z-index-issue-internet-explorer-7-z-index/

Working fiddle: http://jsfiddle.net/IrvinDominin/aTUC5/

Problem

I'm using http://code.google.com/p/select-box/ select box jquery plugin so that I can change the appearance of my select boxes. The plugin is great and works fine except in ie7 where the dropdown lists appear behind any element that they happen to overlap with. It seems to be a known issue but no-one seems to have answered the person who reported it. I was wondering if anyone could suggest a fix? the issue can be seen here: http://code.google.com/p/select-box/issues/detail?id=8 thanks for any help :)

Original source