Fancybox single image loading fails on IE

100 Views Asked by At

Using Fancybox single image box, the image is not completely loaded in IE. Chrome loads the image perfectly, but on IE it looks like as the loading is cut short somehow. The image itself comes from DB as byte array and loads just fine on IE when set as an ordinary html image.

This is what I get on Fancybox: enter image description here

Any pointers on how to force the loading to continue until the whole image is sent?

Edit

JQuery for fancybox:

$("a#single_image").fancybox({
    'type': 'image',
    'hideOnContentClick' : 'true'
});

Image:

<a id="single_image" href="<%= Source %>"><img runat="server" id="largeImg" /></a>  

Where "Source" is a string containing the image data.

1

There are 1 best solutions below

0
On BEST ANSWER

Fixed it myself after scratching my head for a really long time. Turns out the request grows too long for IE to handle (or something like it) when the image data is read twice from the code-behind.
Instead I removed the href attribute from the <a>-tag and added it again with jQuery, so that it's read from the <img>-tag's src attribute, like so:

 $(document).ready(function () {
    var src = $("#<%: largeImg.ClientID %>").attr("src");
    $("#largeImgLink").attr("href", src);
 });

This also keeps the request shorter and reduces traffic load on the server.
On a footnote, this was not a Fancybox-specific issue. The problem was the same with Lightbox also, and only on IE and EDGE. Chrome loaded the image correctly from the beginning.