Results 1 to 4 of 4

Thread: LightBox issue with IE

  1. #1
    Join Date
    Nov 2009
    Location
    Amsterdam
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default LightBox issue with IE

    Hello I'm new to this forum and struggling with an issue with Lightbox.

    Problem : Light Box only shows1/3rd of the picture, rest is black. And it hangs also. It seems to focus around IE7 users.
    Version used : Lightbox v2.03.2
    Site where the problem occurs : www.villasud.nl. For viewing the Lightbox please follow :http://www.villasud.nl/vakantiehuis/44/aquarius and click on the Villa image.

    Some of our visitors have problems with viewing the lightbox we've implemented for quite some years now. It happend suddenly and seems to grow...maybe an IE update? The problem is that I'm not able to troubleshoot the issue because I do NOT have this problem anywhere on my computers, browsers or different OS (mac, linux, Vista, XP etc).

    I've did some research already but and added code to rule out the IE problem...no luck so far.
    Please advice. If you need css/js code please let me know I'll post it.
    Thanks in advance.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    These images appear to be generated by the server:

    Code:
    http://www.villasud.nl/includes/make_image.php?id=704&style=image
    If that's new, that might be the problem.

    Even so, it appears that once the image is cached it works OK. To that end, you can try making an absolutely positioned hidden division above and to the left of the page that will load these images:

    HTML Code:
    <div style="position:absolute;top:-3000px;left:-3000px;visibility:hidden;">
    <img src="http://www.villasud.nl/includes/make_image.php?id=704&style=image" alt="">
    <img src="http://www.villasud.nl/includes/make_image.php?id=781&style=image" alt="">
    <!-- and so on, list all the images used -->
    </div>
    Once you have all of the images in there, place it as the very first thing after your opening <body> tag.

    Or, you can try upgrading to v2.04a of lightbox:

    http://www.dynamicdrive.com/forums/s...470#post163470

    But that may have the same problem.

    I'll do some tests, if I can (server side code isn't always portable to a local mock up, which is what I will have to use) to see if I can duplicate the problem and/or eliminate it.

    It may also help if I could see the PHP source code of the:

    http://www.villasud.nl/includes/make_image.php

    file.

    Edit: The main problem appears to be the server side image generation. If you could switch back to actual images, and optimize those, that would be the best chance at fixing this.
    Last edited by jscheuer1; 11-23-2009 at 05:30 AM. Reason: add info
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Nov 2009
    Location
    Amsterdam
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default make_image code

    Thanks for the swift reply. If server side image generation seems to be the problem could it be a bandwith issue to/ from the server or a setting on the server itself. eg a slow connection ?

    The code make_image is below :
    <?php

    require_once($_SERVER['DOCUMENT_ROOT'] . "/includes/db_connection.php");
    require_once($_SERVER['DOCUMENT_ROOT'] . "/classes/imageeditor.class.php");

    $style = (isset($_GET['style'])) ? $_GET['style'] : NULL;
    $id = (isset($_GET['id'])) ? $_GET['id'] : NULL;
    $width = (isset($_GET['width'])) ? $_GET['width'] : 0;
    $height = (isset($_GET['height'])) ? $_GET['height'] : 0;
    $url = (isset($_GET['url'])) ? $_GET['url'] : "";

    // Maak plaatje
    $image = new ImageEditor();

    // Aanbiedingen
    if ($style == "aanbieding")
    {
    $image->getAanbiedingImg($id);
    }

    // Specials
    elseif ($style == "special")
    {
    $num = (isset($_GET['num'])) ? $_GET['num'] : 1;

    $image->getSpecialImg($id, $num);
    }

    // Omgevingen
    elseif ($style == "omgeving")
    {
    $num = (isset($_GET['num'])) ? $_GET['num'] : 1;

    $image->getOmgevingImg($id, $num);
    }

    // Villa images
    elseif ($style == "image" || $style == "print")
    {
    $image->getVillaImg($id);
    }

    // Plaats images
    elseif ($style == "plaats")
    {
    $num = (isset($_GET['num'])) ? $_GET['num'] : 1;

    $image->getPlaatsImg($id, $num);
    }

    // Directe filename
    elseif ($style == "file")
    {
    $url = $_SERVER['DOCUMENT_ROOT'] . str_replace('./', '/', $url);
    $pos = strrpos($url, '/') + 1;

    $path = substr($url, 0, $pos);
    $filename = substr($url, $pos);

    unset($image);

    $image = new ImageEditor($filename, $path);
    }

    // Secties
    elseif ($style == "sectie")
    {
    $url = $_SERVER['DOCUMENT_ROOT'] . '/img/fotoselectie/' . str_replace(array('./', '/'), array('', ''), $url);
    $pos = strrpos($url, '/') + 1;

    $path = substr($url, 0, $pos);
    $filename = substr($url, $pos);

    unset($image);

    $image = new ImageEditor($filename, $path);
    }

    // Resize het plaatje
    if ($width > 0 || $height > 0)
    {
    $image->resize($width, $height);

    // Maximale hoogte van 0.7 keer breedte
    if ((($image->y) > ($image->x * 0.75)) && $style != "print")
    {
    if ($image->y < (($image->x * 0.7) + 30))
    $image->crop(0, 0, $image->x, ($image->x * 0.7));
    else
    $image->crop(0, 30, $image->x, ($image->x * 0.7));
    }
    }

    // Zet vergrootglas in de image
    if (isset($_GET['vergroot']) && !$image->error)
    {
    $vergroot_link = $_SERVER['DOCUMENT_ROOT'] . "/img/lightbox/vergroot.png";
    $vergroot = @imagecreatefrompng($vergroot_link);

    $image->image_overlap($vergroot, $_GET['pos'], $_GET['offset']);
    }

    if (($image->x >= 300) && ($style == "image" || $style == "print"))
    {
    $watermerk_link = ($image->x < 500) ? $_SERVER['DOCUMENT_ROOT'] . "/img/watermerk/watermerk_klein.png" : $_SERVER['DOCUMENT_ROOT'] . "/img/watermerk/watermerk_klein.png";
    $watermerk = @imagecreatefrompng($watermerk_link);

    $image->add_watermark($watermerk);
    }

    // Teken het plaatje
    if (!$image->error)
    {
    $image->outputImage();
    }

    ?>

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Quote Originally Posted by rpboer View Post
    Thanks for the swift reply. If server side image generation seems to be the problem could it be a bandwith issue to/ from the server or a setting on the server itself. eg a slow connection ?
    Bandwidth is unlikely to be the problem but I suppose it could be. If so, that's beyond your control. However, unless there is some better way to code make_image (I'm no expert at PHP) that would make absolutely certain that the browser could not under any circumstances stop waiting for the image until it is finished, I think you need to go back to actual images. What I think is happening is that the load on the server is such that it just doesn't complete the image in time. As a result the browser receives a corrupt version of the image.

    You could ask in the PHP forum to see if anyone there knows about this issue in IE and can offer either a solution, or confirmation of my suspicion that it just isn't going to work reliably unless real images are used.

    In any case, the image fies themselves are rather large byte wise, and should be optimized.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Bookmarks

Posting Permissions

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