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 6 of 6
  1. #1
    New Coder
    Join Date
    Sep 2008
    Posts
    13
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Navigation Bar Appearing On Top Of Lightbox

    Hello,
    I recently replaced the default navigation bar for magento with my own one, however now this appears on top of the lightbox. I have tried two different lightboxes so that is obviously not the problem.

    The code for the nav bar (seen here: www.gadgetfreakz.co.uk) is:

    Code:
     <div id="globalheader">
    <ul id="globalnav">
    	<li id="gn-logo"><a href="/"></a></li>
    	<li id="gn-phone"><a href="/mobile-phones.html"></a></li>
    	<li id="gn-spy"><a href="/spy-equipment.html"></a></li>
    	<li id="gn-player"><a href="/mp3-players.html"></a></li>
    	<li id="gn-tele"><a href="/portable-televisions.html"></a></li>
    	<li id="gn-sat"><a href="/navigation.html"></a></li>
    	<li id="gn-blue"><a href="bluetooth.html"></a></li>
    </ul>
    </div>
    Any help is appreciated.

    Kind Regards
    Tom

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,863
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    I recently replaced the default navigation bar for magento with my own one, however now this appears on top of the lightbox. I have tried two different lightboxes so that is obviously not the problem.

    The code for the nav bar (seen here: www.gadgetfreakz.co.uk) is:
    How can I view a lightbox in that page?
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    New Coder
    Join Date
    Sep 2008
    Posts
    13
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Hello,

    Sorry go to : http://www.gadgetfreakz.co.uk/digita...ile-phone.html

    And click on one of the product images.

    Regards
    Tom

  • #4
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,863
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    You have
    Code:
    #ig-lightbox-back {/*ig_lightbox.css (line 15)*/
    left:0;
    position:absolute;
    top:0;
    z-index:900;
    }
    #globalheader {/*styles.css (line 1390)*/
    height:38px;
    margin:18px auto;
    overflow:hidden;
    position:relative;
    width:819px;
    z-index:9998;
    }
    So the reason is very obvious, isn't? Set a smaller z-index value, say 100 for #globalheader
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • Users who have thanked abduraooft for this post:

    Hioncc (11-07-2009)

  • #5
    New Coder
    Join Date
    Sep 2008
    Posts
    13
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Hello,
    Thanks a lot, still slapping myself for missing it.

    Much Appreciated.

    Regards
    Tom

  • #6
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,863
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    Make use firebug, which is great addon for Firefox to inspect the elements and their properties.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)


  •  

    Posting Permissions

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