Using time delays in Javascript

Using time delays in Javascript

I have a gif image that I want to stretch by making the height and/or
width variable. However, I want the image stretching to be done at a speed
I set, so it is progressive and visible as it occurs on the screen. The
code below works, but it renders the image immediately as a complete
image, with no stretching visible. So I thought: insert some kind of timer
function to slow down the execution of the "stretching" code. I have tried
setTimeout and setInterval (using 1/100 sec delays), but I have not been
able to make either work. What am I doing wrong here guys?
$(window).load(function(){
setInterval(function(){
var i=1;
for (i;i<400;i++) {
$("#shape1").html('<img src="image.gif" width="'+i+'"
height="40">');
}
},10);
});