0

I load the image but img.naturalWidth returns zero (presumably because the image has not loaded when the call is executed). A page refresh solves the problem, because the image is in the cache, and the correct width is returned.

How do I solve this?

Thanks for your help. Here is example code:

<!DOCTYPE html>
<html>
  <head>
  </head> 

  <body>
    <div id="imageArea"></div>
    <script> 
       var img = document.createElement("img");
       img.id="test";
       img.src = "https://upload.wikimedia.org/wikipedia/commons/thumb/b/b3/Wikipedia-logo-v2-en.svg/135px-Wikipedia-logo-v2-en.svg.png";
       console.log(img.naturalWidth+" "+ img.naturalHeight);
       img.width=img.naturalWidth*2;
       img.height= img.naturalHeight*2;
       document.getElementById("imageArea").appendChild(img); 
    </script>  

  </body>
</html>

I have tried putting in delays and using img.width to get the width, without success.

Haywire
  • 1
  • 1

0 Answers0