ansaurus

Question

The image's dimension is different from when it's loading and after it loads.

Answer 1

A:

Its always a good idea to run javascript after the page elements have finished loading. I usually do this in jQuery, like this:

$(function(){
  //code to run after load goes here
});

Otherwise, you can try modifying the body tag and giving it an onload attribute, like:

<body onload="myFunction();" >

Andy Groff 2010-09-26 05:06:07

Answer 2

+2 A:

Run the function after it has loaded, You'd do it like this:

Using the DOM exclusively

var newImg = document.createElement('img');
newImg.src = "theImage.png";
newImg.alt = "Always specify an alternate text for accessibility, even if left blank";
newImg.onload = function () {
    //Image manipulation
};
galleryNode.appendChild(newImg); //Replace galleryNode with the parent element of your image.

Using innerHTML

galleryNode.innerHTML += "<img src='theImage.png' alt='' id='newImage1'/>";
var newImg = document.getElementById('newImage1');
newImg.onload = function () {
    //Image manipulation
};

Using jQuery

$('.gallery img').live('load',function () {
    //Image manipulation
});

Andrew Dunn 2010-09-26 05:08:08

ansaurus

tags:

views:

answers:

The image's dimension is different from when it's loading and after it loads.

related questions