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 5 of 5
  1. #1
    New Coder
    Join Date
    Aug 2007
    Posts
    66
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Needing Help - lightbox Overlay only spanning some of page

    Hi Again, I got another problem if I fix this one my site is finished and bug free (woo!), Its another weird one.

    I am using a lightbox script for viewing gallery images, which works fine, the only problem is that the overlay which colours the screen when the image loads is only showing for a part of the screen in IE (Works fine in all other browsers). My content height resizes as needed, but my navigation height is set, and the overlay only extents to cover the page down to the end of the navigation, no further. Here is the css code for the lightbox, I modified it slightly, but here it is:




    #lightbox{
    background-color:#eee;
    padding: 10px;
    border-bottom: 2px solid #666;
    border-right: 2px solid #666;
    }
    #lightboxDetails{
    font-size: 0.8em;
    padding-top: 0.4em;
    }
    #lightboxCaption{ float: left; }
    #keyboardMsg{ float: right; }
    #closeButton{ top: 5px; right: 5px; }

    #lightbox img{ border: none; clear: both;}
    #overlay img{ border: none; }


    #overlay{
    display:none;
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    z-index:5000;
    background-color:#808080;
    -moz-opacity: 0.8;
    opacity:.80;
    filter: alpha(opacity=80);
    }
    #overlay[id]{ /* IE6 and below Can't See This */
    position:fixed;


    Any help would be amazing!

  • #2
    Regular Coder
    Join Date
    Jun 2007
    Posts
    145
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I did a fairly large mod to lightbox by placing a second close button at the top / resizing the border to incorporate this change. I think I know what you mean that happens on one specific image for me, and I cant otherwise change it!
    Visit http://www.UpsetPC.com for all your computer support needs!

  • #3
    New Coder
    Join Date
    Aug 2007
    Posts
    66
    Thanks
    2
    Thanked 0 Times in 0 Posts
    I cant really show a picture coz i dont have IE on my laptop, but its like when the image open in the lightbox, the background is supposed to be overed with a grey overlay to kinda fade it out, the problem is this overlay does not span the full page, its not really a big issue it just makes the site look messy. Any help, anybody ?

  • #4
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    I found this on the lightbox site

    http://www.huddletogether.com/projects/lightbox/

    Frank

    The shadow overlay doesn't stretch to cover full browser window.
    Remove the default margin and padding from the body tag. Add body{ margin: 0; padding: 0; } to your stylesheet.
    The shadow overlay doesn't show up in IE.
    Find the filter: progidXI… line that you added to your stylesheet. There is a reference to the overlay.png in this line. Make sure that it is set relative to the current webpage, not relative to the CSS file.
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #5
    New Coder
    Join Date
    Aug 2007
    Posts
    66
    Thanks
    2
    Thanked 0 Times in 0 Posts
    hi yes, I did use overlay.png before but it was to the same effect, i dont have any margin tags either, thanks


  •  

    Posting Permissions

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