0

after taking the reference from this answer

Open image in new window

i did the the same code.

function openImage() {
    var largeImage = document.getElementById('viewImage');
    largeImage.style.display = 'block';
    largeImage.style.width = 200 + "px";
    largeImage.style.height = 200 + "px";
    var url = largeImage.getAttribute('src');
    window.open(url, 'Image', 'width=largeImage.stylewidth,height=largeImage.style.height,resizable=1');
}

but when this function executed, blank page is showing when i view image src in console, it is showing proper data.enter image description here

my img element is also showing me image properly, enter image description here

but this is how my page is being shownenter code here

what do you think what is wrong in my code?

  • Can you provide complete html code? – xoxo Sep 25 '18 at 08:14
  • Can you post the actual HTML content and not the screenshots? – sandesh kota Sep 25 '18 at 08:15
  • That solution is for image with actual url as src, for an image with base64 encoded data as src refer to https://stackoverflow.com/questions/27798126/how-to-open-the-newly-created-image-in-a-new-tab – AvcS Sep 25 '18 at 08:17

1 Answers1

0

That solution is for image with actual url as src, in your case image src is a base64 encoded string not url.

Base64 support for Window.open is not same across all browsers, it works on firefox but it won't work on chrome and IE.

So, you can try this instead

function openImage() {
    var largeImage = document.getElementById('viewImage');
    largeImage.style.display = 'block';
    largeImage.style.width = 200 + "px";
    largeImage.style.height = 200 + "px";

    var w = window.open("");
    w.document.write(largeImage.outerHTML);
}
AvcS
  • 2,263
  • 11
  • 18