Animating Text Styles : Text HTML « HTML « JavaScript DHTML






Animating Text Styles


<html>
<head>
<title>Styling Text</title>
<script language="JavaScript">
var color = true
var heading = null
function styleText(milliseconds) {
 window.setInterval("changeColors()", milliseconds)
}
function changeColors() {
 var heading;
 if(document.getElementById != null)
   heading = document.getElementById("styleme")
 else if(navigator.appName == "Microsoft Internet Explorer")
   heading = document.all.item("styleme")
 
 if(color && heading != null) {
   heading.style.backgroundColor = "rgb(255,0,0)"
   heading.style.color = "rgb(0,200255)"
 }else if(heading != null) {
   heading.style.backgroundColor = "rgb(255,255,255)"
   heading.style.color = "rgb(0,200,0)"
 }
 color = ! color;
}
</script>
</head>
<body onload="styleText(1000)" bgcolor="white">
<h1 align="center" id="styleme" style="background-color: rgb(255,255,255)">
I am changing!</h1>
</body>
</html>

           
       








Related examples in the same category

1.An example of a scrolling message
2.Moving Text
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