<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>Animation</title> <script type="text/javascript"> function positionMessage() { if (!document.getElementById) return false; if (!document.getElementById("message")) return false; var elem = document.getElementById("message"); elem.style.position = "absolute"; elem.style.left = "50px"; elem.style.top = "100px"; movement = setTimeout("moveMessage()",5000); } function moveMessage() { if (!document.getElementById) return false; if (!document.getElementById("message")) return false; var elem = document.getElementById("message"); var xpos = parseInt(elem.style.left); var ypos = parseInt(elem.style.top); if (xpos == 200 && ypos == 100) { return true; } if (xpos < 200) { xpos++; } if (xpos > 200) { xpos--; } if (ypos < 100) { ypos++; } if (ypos > 100) { ypos--; } elem.style.left = xpos + "px"; elem.style.top = ypos + "px"; movement = setTimeout("moveMessage()",10); } function addLoadEvent(func) { var oldonload = window.onload; if (typeof window.onload != 'function') { window.onload = func; } else { window.onload = function() { oldonload(); func(); } } } addLoadEvent(positionMessage); </script> </head> <body> <p id="message">Whee!</p> </body> </html>