Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New Coder
    Join Date
    Oct 2012
    Posts
    44
    Thanks
    7
    Thanked 3 Times in 3 Posts

    How to work around IE7 silliness (z-index)

    I'm working on a map, which has clickable marked areas on it, and on hover each area brings up a popup. Works fine in all browsers except IE7 (unfortunately I need to get it working there too). In ie7 it just shows all the popups at once. I'll be happy with a way to just display the marked areas with no hover popups at all.

    The code for the popups:
    Code:
    .popup{ 
    	width:150px;
    	height:45px;
    	position: absolute;
    	top: -6px;
    	left: -150px;
    	z-index:-1;
    	margin: 5px 5px;
    	text-align: center;
    	background-color: black;
    }
    .popup p{
    	margin: 5px 0 0 0;
    }
    #itpin{ 
    	width: 40px;
    	height: 31px;
    	position:absolute;
    	top:412px;
    	left:465px;
    	cursor: default;
    }
    #itpin:hover .popup{ 
    	z-index:2;
    }
    So the popup sits behind the main image until mouse hover, when z-index changes to 2 to bring it forward. IE7 seems to go straight to z-index:2. the text that appears in the popups is in the html.

  • #2
    New Coder
    Join Date
    Oct 2012
    Posts
    44
    Thanks
    7
    Thanked 3 Times in 3 Posts
    ok I got it working in IE7 , don't ask me how.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •