Image native width in jquery

Question

With jQuery, i change the src of an image on click

$(\"#thumb li img\").click(function() {
var newlinkimage = $(this).attr(\"src\");

newlinkimage = newlinkimage         


        

Answer 1

You want to get the real width of the image before changing it, then set the new picture to that width. you can do this with $(img).load:

var pic_real_width;
var pic_real_height;

$(img).load(function() {
    // need to remove these in of case img-element has set width and height
    $(this).removeAttr("width")
           .removeAttr("height");

    pic_real_width = this.width;
    pic_real_height = this.height;
});

$("#thumb li img").click(function() {
var newlinkimage = $(this).attr("src");

newlinkimage = newlinkimage.substring(14,17);

        $("#avant img").attr("src", 'retouche-hr' + newlinkimage + '-a.jpg').width(pic_real_width);
        $("#apres img").attr("src", 'retouche-hr' +newlinkimage + '-b.jpg').width(pic_real_width);