The problem is this: there is a server from which a mobile HTML5 application pulls images with the .png extension compressed as jpeg. That is, some lazy person just picked up and changed the extension of the files with his hands from .jpg to .png. I can not change them.

How to make these images appear in IE 10+?

Here is an example: link text

  • It seems to me that you need to write a decoder in js . Or give the correct extensions. I have on the 11th version, too, "Failed to decode the image." I would use this decoder: github.com/lampaa/imageLib/blob/master/modules/jpeg-decoder.js Then I would insert the pictures as a canvas element. Perhaps there are some other ways. - lampa
  • Although no, I lie, nothing happens, there is no such thing in browsers as Buffer. - lampa

1 answer 1

 <!DOCTYPE html> <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script> function preload(arrayOfImages) { $(arrayOfImages).each(function(){ var pic = this; $.ajax({ url: pic.src }).done(function(data) { pic.src="data:image/jpeg" + data; }); }); }; $(document).ready(function() { preload($('img')); }) ; </script> </head> <body> <div><img src="http://komandir.kz/personal/worker/promo/photo/14013427121.png"/></div> <p>Pic</p> </body> </html>

This option will roll if the pictures are on the same domain where the html-page will hang. Well, or if you use non-browser-based javascript, and you have the opportunity to shit vigorously at crossdomain-restriction.

Oh, I almost forgot. Screw the data into base64. Otherwise, the markup will go.