HH's Test Page!
Header 1
Header 2
Header 3
Header 4
Header 5
Header 6
Normal paragraph text
bold italicThis is a blockquote.
- ul (bulleted) list
- ul (bulleted) list
- ul (bulleted) list
- ol (numbered) list
- ol (numbered) list
- ol (numbered) list
DIV
body {
font:76% normal verdana,arial,tahoma;
}
h1, h2 {
font-size:1em;
}
#fooObject {
/* simple box */
position:absolute;
left:0px;
top:8em;
width:5em;
line-height:3em;
background:#99ccff;
border:1px solid #003366;
white-space:nowrap;
padding:0.5em;
}
var foo = null; // object
function doMove() {
foo.style.left = parseInt(foo.style.left)+1+'px';
setTimeout(doMove,20); // call doMove in 20msec
}
function init() {
foo = document.getElementById('fooObject'); // get the "foo" object
foo.style.left = '0px'; // set its initial position to 0px
doMove(); // start animating
}
window.onload = init;
Javascript animation: Demo 1
Recursive setTimeout-based animation
I am foo.