Advanced Search

Fix IE7 z-index bug for dropdown menus

/ Published in: JavaScript
Save to your folder(s)

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  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

You need to login to post a comment.