Controlling Loop speed for animation

[M Katz]

Hi,

I'm using the following to allow dynamic resixing of an image (when the usre
presses down on a button):

function widthup() {
image.width = image.width + 1;
width.innerText = image.width;
if(x==1) {
setTimeout('widthup()',0);
}
}

even when the 'setTimout' is at zero it goes pretty slowly. Any way to have
something faster?

 

[Lasse Reichstein Nielsen]

I'm using the following to allow dynamic resixing of an image (when the usre
presses down on a button):

function widthup() {
image.width = image.width + 1;
width.innerText = image.width;

I assume that "image" and "width" are variables declared somewhere else.

Try changing this to:
width.firstChild.nodeValue = image.width;
It is known to be faster and even more widely supported.

if(x==1) {
setTimeout('widthup()',0);

Try changing this to
setTimeout(widthup,50);
It should be a little faster to use the function than to use a string
that must be parsed.

Setting the time to zero is unreasonable. It probably doesn't matter,
but I prefer not to provoke the system.

You could save a little time by using setInterval. Then you don't need
to reset the timer every round.

With a little massage, you get:

---
function widthup() {
width.firstChild.nodeValue = ++(image.width);
}

var cid;
function startIt() {
cid = setInterval(widthup,50);
}
function stopIt() {
clearInterval(cid);
}

 

[M Katz]

I assume that "image" and "width" are variables declared somewhere else.

Try changing this to:
width.firstChild.nodeValue = image.width;
It is known to be faster and even more widely supported.


Try changing this to
setTimeout(widthup,50);
It should be a little faster to use the function than to use a string
that must be parsed.

Setting the time to zero is unreasonable. It probably doesn't matter,
but I prefer not to provoke the system.

You could save a little time by using setInterval. Then you don't need
to reset the timer every round.

With a little massage, you get:

---
function widthup() {
width.firstChild.nodeValue = ++(image.width);
}

var cid;
function startIt() {
cid = setInterval(widthup,50);
}
function stopIt() {
clearInterval(cid);
}

Hi and thanks! I actually solved it as follows:

step = 1;

function widthup() {
image.width = image.width + step;
width.innerText = image.width;
if(x==1) {
step++;
setTimeout('widthup()',0);
}
}

The idea is that as people press on the button longer the resizing speeds
up. Effectively, the amount of change start at 1 and increases by 1 at each
loop. When the button is released it resets "step" to 1. But I will try your
way also!

 

[Evertjan.]

M Katz wrote on 14 jul 2003 in comp.lang.javascript:

I'm using the following to allow dynamic resixing of an image (when
the usre presses down on a button):

function widthup() {
image.width = image.width + 1;
width.innerText = image.width;
if(x==1) {
setTimeout('widthup()',0);
}
}

even when the 'setTimout' is at zero it goes pretty slowly. Any way to
have something faster?

image.width = image.width + 2;

or more consize:

image.width += 2;