RETRIEVE ORIGINAL IMAGE LENGTH & HEIGHT WITH JQUERY?

Sanjay Sharma

Total Post:45

Points:315
Posted by  Sanjay Sharma
JQuery  HTML  CSS 
 977  View(s)
Ratings:
Rate this:

I have a display thumbnail at 250px by 250px. I want to be able to retrieve its original width and height when clicking on the thumbnail.

I tried doing this:

$(function() {

    $(".img_section").on('click', function() {

        var img = $(this).children(".test_img").attr("src");

        theImg.src = img.attr("src");

 

        var imgNaturalWidth = theImg.width();

        var imgNaturalHeight = theImg.height();

 

        alert(imgNaturalWidth);

        alert(imgNaturalHeight);

}) // not working

Any help will be appreciated, thanks.

  1. Ankit Singh

    Post:341

    Points:2389
    Re: Retrieve original image length & height with jquery?

    $(function () {

        $(".img_section").on('click', function () {

            $this = $(this).children('img');

            var image = new Image();

            image.src = $this.attr("src");

            image.onload = function () {

                alert('width: ' + this.width +' '+'height: '+ this.height); /* calculation the width  and height from image onload */

            };

        });

    });

Answer

NEWSLETTER

Enter your email address here always to be updated. We promise not to spam!