Moving Text : Text HTML « HTML « JavaScript DHTML

Moving Text


/*
Mastering JavaScript, Premium Edition
by James Jaworski 

ISBN:078212819X
Publisher Sybex CopyRight 2001
*/

<html>
<head>
<title>Moving Text</title>
<script language="JavaScript">
var heading = null
function moveText(milliseconds) {
 window.setInterval("changePosition()", milliseconds)
}
function changePosition() {
 var x = Math.random()*400
 var y = Math.random()*400
 if(document.getElementById)
  heading = document.getElementById("moveme")
 else if(navigator.appName == "Microsoft Internet Explorer")
  heading = document.all.item("moveme")
 else if(document.layers)
  heading = document.layers["moveme"]
 if(heading != null) {
  if(heading.style == null) { // Navigator 4
   heading.left = x
   heading.top = y
  }else if(heading.style.left != null) { // DOM-capable
   heading.style.left = x
   heading.style.top = y
  }else{ // IE 4
   heading.style.posLeft = x
   heading.style.posTop = y
  }
 }
}
</script>
</head>
<body onload="moveText(2000)">
<div id="moveme" style="position:absolute;font-size:xx-large;">This text moves!</div>
</body>
</html>

Related examples in the same category

1.	An example of a scrolling message
2.	Animating Text Styles
3.	Using the TextRectangle Object Properties
4.	Exploring the Bounding TextRange Properties
5.	compareEndPoints() Method
6.	Two Search and Replace Approaches (with Undo)
7.	Using the document.selection Object
8.	Encipher and Decipher