Hi there, I hope someone can help me.
I have a script which moves layers around, so far I have got it to move the layers OK, but I want the layers to animate, not move instantly. Although the script moves the layer a pixel at a time, the loop is so quick the effect is lost.I can't seem to make setTimeout() work here, so I'm looking for any suggestion.
I'm quite inexperienced here so any help is appreciated.
// Code starts here, IE only
var the_layer; // the layer to be moved
var deststr // the dest in string form
var dest; // the dest in int form
var px_pos; // the position of "px" (lit)
var pixelstr
var cur_x // Current X coordinate
var cur_y // Current Y Coordinate
function layerMove(l_name, l_direction, l_pixelstr, l_delaystr){
l_pixels = parseInt(l_pixelstr); //Convert pixel to integer
l_delay = parseInt(l_delaystr); // Convert delay to integer
if(document.layers){alert("This code should not be run on non-IE browsers."
;}
if(document.all){ //good to go for IE5+
// Next stage stores layer position in cur_x_real
cur_x = document.all[l_name].style.left; //current x position +"px"
px_pos = cur_x.indexOf("px" // Find "px" in the buffer
var cur_x_str = cur_x.substring(0,px_pos); // snip off px (leaving number only)
var cur_x_real = parseInt(cur_x_str); // Convert to integer
alert("current _x_ position"
alert(cur_x_real);
// As above, stores layer y position in cur_y_real
cur_y = document.all[l_name].style.top; //current y position +"px"
px_pos = cur_y.indexOf("px" // find "px" in the buffer
var cur_y_str = cur_y.substring(0,px_pos); // remove "px" !!
var cur_y_real = parseInt(cur_y_str); // Convert to integer
alert("current _y_ position"
alert(cur_y_real);
// The next few lines decide what to do (dependant on l_direction)
// THE NEXT PART IS THE PART I NEED TO LOOP
if(l_direction=='up'){
dest = (cur_y_real - l_pixels);
while(cur_y_real > dest){ // Loop while the current position is diff from destination
cur_y_real --;
document.all[l_name].style.top = cur_y_real; // Move towards destination
}
}
else if (l_direction=='down'){
dest = (cur_y_real + l_pixels);
while(cur_y_real < dest){
cur_y_real ++;
document.all[l_name].style.top = cur_y_real;
}
}
// more else if()'s here for other directions
// you get the idea
Mixed Linux/Win2000 Network Administrator
I have a script which moves layers around, so far I have got it to move the layers OK, but I want the layers to animate, not move instantly. Although the script moves the layer a pixel at a time, the loop is so quick the effect is lost.I can't seem to make setTimeout() work here, so I'm looking for any suggestion.
I'm quite inexperienced here so any help is appreciated.
// Code starts here, IE only
var the_layer; // the layer to be moved
var deststr // the dest in string form
var dest; // the dest in int form
var px_pos; // the position of "px" (lit)
var pixelstr
var cur_x // Current X coordinate
var cur_y // Current Y Coordinate
function layerMove(l_name, l_direction, l_pixelstr, l_delaystr){
l_pixels = parseInt(l_pixelstr); //Convert pixel to integer
l_delay = parseInt(l_delaystr); // Convert delay to integer
if(document.layers){alert("This code should not be run on non-IE browsers."
;}if(document.all){ //good to go for IE5+
// Next stage stores layer position in cur_x_real
cur_x = document.all[l_name].style.left; //current x position +"px"
px_pos = cur_x.indexOf("px"
; // Find "px" in the buffervar cur_x_str = cur_x.substring(0,px_pos); // snip off px (leaving number only)
var cur_x_real = parseInt(cur_x_str); // Convert to integer
alert("current _x_ position"
alert(cur_x_real);
// As above, stores layer y position in cur_y_real
cur_y = document.all[l_name].style.top; //current y position +"px"
px_pos = cur_y.indexOf("px"
; // find "px" in the buffervar cur_y_str = cur_y.substring(0,px_pos); // remove "px" !!
var cur_y_real = parseInt(cur_y_str); // Convert to integer
alert("current _y_ position"
alert(cur_y_real);
// The next few lines decide what to do (dependant on l_direction)
// THE NEXT PART IS THE PART I NEED TO LOOP
if(l_direction=='up'){
dest = (cur_y_real - l_pixels);
while(cur_y_real > dest){ // Loop while the current position is diff from destination
cur_y_real --;
document.all[l_name].style.top = cur_y_real; // Move towards destination
}
}
else if (l_direction=='down'){
dest = (cur_y_real + l_pixels);
while(cur_y_real < dest){
cur_y_real ++;
document.all[l_name].style.top = cur_y_real;
}
}
// more else if()'s here for other directions
// you get the idea
Mixed Linux/Win2000 Network Administrator
