title: How to set image Width/Height
body: <p>I have what I think is very simple code and I expect it to modify the img width/height but it is not working.</p>
  
  <p>I use createObjectURL, then get the width/height of that image.
  Then, I will calculate the width/height so that I can create a thumbnail in the proper proportion (not distort the original image but just make it smaller). For now, I am just hard-coding values to see if it works, but it does not.</p>
  
  <p>Then, I load the image with the new values.</p>
  
  <p>But it does not change the original height/width that I set for the img in the css.</p>
  
  <p>A fiddle is here:</p>
  
  <p>All, help, as always is appreciated. Belows is the relevant block of code. The id="fileDisplay" is the container. The background url will be a "loading" image. id="imgDisaply" is the img component where the image gets loaded, which covers up the "loading" background. It was the only way I could figure out how to give a "loading" image as feedback to the user as the image loads.</p>
  
  <pre><code>imgSrc = window.URL.createObjectURL(this.files[0]);
  getImgSize(imgSrc);
  document.getElementById("imgDisplay" + justNumber).width="500";
  document.getElementById("imgDisplay" + justNumber).height="200";
  document.getElementById("imgDisplay" + justNumber).src = imgSrc;
  </code></pre>