HTML5: cómo get la dimensión de la image

Tengo este script, se usa para get el ancho y el alto de la image cargada del browser.

reference: http://renevier.net/misc/resizeimg.html

function createReader(file) { reader.onload = function(evt) { var image = new Image(); image.onload = function(evt) { var width = this.width; var height = this.height; alert (width); // will produce something like 198 }; image.src = evt.target.result; }; reader.readAsDataURL(file); } for (var i = 0, length = input.files.length; i < length; i++) { createReader(input.files[i]); } 

Quiero acceder al ancho y alto del valor desde fuera de la function createReader . ¿Cómo puedo hacer eso?

One Solution collect form web for “HTML5: cómo get la dimensión de la image”

Cambie "createReader" para que pase una function de controller para que se llame cuando la image esté disponible:

 function createReader(file, whenReady) { reader.onload = function(evt) { var image = new Image(); image.onload = function(evt) { var width = this.width; var height = this.height; if (whenReady) whenReady(width, height); }; image.src = evt.target.result; }; reader.readAsDataURL(file); } 

Ahora cuando lo llames, puedes pasar una function para hacer lo que quieras con las dimensiones de la image:

  createReader(input.files[i], function(w, h) { alert("Hi the width is " + w + " and the height is " + h); }); 
  • hacer un canvas tan ancho y tan alto como el padre
  • Cómo cargar una image en un canvas de HTML5
  • Alternar iFrame Sandbox
  • navigator.geolocation.getCurrentPosition siempre falla en Chrome y Firefox
  • impidiendo que la búsqueda del browser ctrl f se desplace por mi div queuepsado
  • ¿Debería haber solo un object EventSource por aplicación?
  • Limitando framerate en Three.js para boost el performance, requestAnimationFrame?
  • ¿Devuelve las coorderadas del clic del mouse en el canvas de HTML5 usando los events del mouse de Javascript?
  • Cómo encontrar el ancho y la altura de un DisplayObject en EaselJS
  • Phonegap: configuration del file config.xml para habilitar la camera
  • ¿Es posible build una aplicación de Android con PhoneGap estrictamente dentro de Visual Studio?
  • Javascript tiene muchos buenos JS marco (como Node.js AngularJS Vue.js React.js) es el mejor lenguaje de script.