Posted By

threehz on 11/24/10


Tagged


Versions (?)

Fix IE7 z-index bug for dropdown menus


 / Published in: JavaScript
 

  1. function isIE7() {
  2. return (navigator.appVersion.indexOf("MSIE 7.")==-1) ? false : true;
  3. }
  4.  
  5. function zIndexWorkaround() {
  6. // If the browser is IE7,
  7. if(isIE7())
  8. {
  9. /*
  10.   ** For each div with class menu (i.e.,
  11.   ** the thing we want to be on top),
  12.   */
  13.  
  14. $("ul.menu").parents().each(function() {
  15. var p = $(this);
  16. var pos = p.css("position");
  17.  
  18. // If it's positioned,
  19. if(pos == "relative" ||
  20. pos == "absolute" ||
  21. pos == "fixed")
  22. {
  23. /*
  24.   ** Add the "on-top" class name when the
  25.   ** mouse is hovering over it, and remove
  26.   ** it when the mouse leaves.
  27.   */
  28. p.hover(function() {
  29. $(this).addClass("on-top");
  30. },
  31. function() {
  32. $(this).removeClass("on-top");
  33. });
  34. }
  35. });
  36. }
  37. }

Report this snippet  

Comments

RSS Icon Subscribe to comments
Posted By: threehz on November 24, 2010

and create a style in your ie7 stylesheet:

z-index: 999

Posted By: threehz on November 24, 2010

err,

.on-top { z-index: 999; }

You need to login to post a comment.