Ok, I’ve been very bored lately so I figured I’d give a go at making a square slide around horizontally using HTML, CSS, and JavaScript. It works wonderfully, but I’m having some issues if I try to make my [I]window.setTimeout(‘document.getElementById(“square”).style.left = ‘ + hPosition + ‘px”‘, time);[I]window.setTimeout(‘document.getElementById(“‘+elementID+'”).style.left = ‘ + hPosition + ‘px”‘, time);
Ultimately, I’d like to change it from [I]document.getElementById()
[CODE]function slideHorizontally(elementID, leftSide, rightSide) {
var element = document.getElementById(elementID);
if (runRightNext) {
var hPosition = rightSide;
var time = 0;
var currentPos = element.offsetLeft;
for (var i = 1; currentPos > leftSide; i++) {
hPosition-=2;
time=50*i;
window.setTimeout(‘document.getElementById(“‘+elementID+'”).style.left = ‘ + hPosition + ‘px”‘, time);
currentPos = hPosition;
}
runRightNext = false;
} else {
var hPosition = leftSide;
var time = 0;
var currentPos = element.offsetLeft;
for (var i = 1; currentPos < rightSide; i++) {
hPosition+=2;
time=50*i;
window.setTimeout(‘document.getElementById(“‘+elementID+'”).style.left = ‘ + hPosition + ‘px”‘, time);
currentPos = hPosition;
}
runRightNext = true;
}
}
elementID is any absolutely positioned element, leftSide is the starting point of the slide, and rightSide is the ending point. leftSide should be set to whatever your absolutely positioned element’s left attribute is set in your stylesheet.
When the function is called a first time it moves from left to right, and the second call moves from right to left, to move the element back to its initial position. If I don’t statically reference the element I want to move, it breaks, and FireBug gives me a “missing ; before statement” error.
So, what am I doing wrong? ?