Utiliza el constructor
Image y el método
.createObjectURL() de la
interface URL. Con el primero crearás un nuevo elemento
HTMLImageElement, mientras que con el segundo obtendrás la ruta del archivo subido, pudiendo así asignarlo al elemento de imagen, mismo que posee las propiedades
width y
height.
Código Javascript
:
Ver originaldocument.querySelector("#id del <input>").addEventListener("change", function(){
var file = this.files[0], image = new Image();
image.src = URL.createObjectURL(file);
image.addEventListener("load", function(){
console.log("Ancho: " + this.width + "px");
console.log("Alto: " + this.height + "px");
}, false);
}, false);
El
script se ejecutará cuando se produzca el evento
change en el
<input>, es decir, cuando se haya elegido el archivo.
DEMO
Un saludo