Print Image Dimensions on Upload
Matt Ryan

Matt Ryan @mattryanmtl

About: They have the internet on computers now?

Location:
Montreal
Joined:
Aug 3, 2020

Print Image Dimensions on Upload

Publish Date: Nov 11 '22
3 0

First we need a simple HTML input:

<input type="file" id="file" />
Enter fullscreen mode Exit fullscreen mode

and then we add the javascript:

var _URL = window.URL || window.webkitURL;

$("#file").change(function(e) {
    var file, img;


    if ((file = this.files[0])) {
        img = new Image();
        img.onload = function() {
            alert(this.width + " " + this.height);
        };
        img.onerror = function() {
            alert( "not a valid file: " + file.type);
        };
        img.src = _URL.createObjectURL(file);


    }

});
Enter fullscreen mode Exit fullscreen mode

This shows the uploaded image's WxH in an alert.

Comments 0 total

    Add comment