DHTML Message Box Code

This script will cycle through 4 different text links. You can adjust the text and links below to meet your web page. Works on IE browser.

Script Demo:

Demo

Dynamic HTML Code:

Insert this code into <head> tags

<style>
<!--
#msgline{
position:relative;
layer-background-color:black;
width:400;
height:12;
}

#msgtext{
background-color:black;
position:absolute;
border: 1px solid black;
width:400;
height:12;

}


.msgtextfont{
font:bold 16px Arial;
postition:absolute;
left:5px;
text-decoration:none;
color:white;
}

.msgtextfont a{
color:white;
text-decoration:none;
}
-->
</style>

Insert this code into <body> tags

<div id="msgline">
<div id="msgtext" class="msgtextfont">Starting Messages...</div>
</div>

<script language="JavaScript1.2">

var speed=4000
var news=new Array()
news[0]="<a href='http://www.road2webmaster.com'>First line of text....</a>"
news[1]="<a href='http://www.road2webmaster.com'>Second line of text....</a>"
news[2]="<a href='http://www.road2webmaster.com'>Third line of text....</a>"
news[3]="<a href='http://www.road2webmaster.com'>Add as many as you want....</a>"

i=0
if (document.all)
tickerobject=document.all.msgtext.style
else
tickerobject=document.msgline.document
function regenerate(){
window.location.reload()
}
function regenerate2(){
if (document.layers)
setTimeout("window.onresize=regenerate",450)
}

function update(){
 BgFade(0xff,0xff,0xff, 0x00,0x00,0x00,10);
if (document.layers){
document.msgline.document.msgtext.document.write('<span class="msgtextfont">'+news[i]+'</span>')
document.msgline.document.msgtext.document.close()
}
else
document.all.msgtext.innerHTML=news[i]

if (i<news.length-1)
i++
else
i=0
setTimeout("update()",speed)
}

 function BgFade(red1, grn1, blu1, red2,
 grn2, blu2, steps) {
 sred = red1; sgrn = grn1; sblu = blu1;
 ered = red2; egrn = grn2; eblu = blu2;
 inc = steps;
 step = 0;
 MsgDither();
 }
 function MsgDither() {
 var epct = step/inc;
 var spct = 1 - epct;
 if (document.layers)
 tickerobject.bgColor =
 Math.floor(sred * spct + ered *
 epct)*256*256 +
 Math.floor(sgrn * spct + egrn * epct)*256 +
 Math.floor(sblu * spct + eblu * epct);
 else
 tickerobject.backgroundColor=
 Math.floor(sred * spct + ered *
 epct)*256*256 +
 Math.floor(sgrn * spct + egrn * epct)*256 +
 Math.floor(sblu * spct + eblu * epct);
 if ( step < inc ) {
 setTimeout('MsgDither()',50);
 }
 step++;
 }

</script>

Instruction:

Make sure that this body tag is included in your webpage. It activates the Message Reader.
Replace <body> with <body onload="if (document.all||document.layers) {regenerate2();update()}">

Webmaster » Web Programming » DHTML » Message Box Code

Related Links:

Home | Sitemap | Bookmark This Page

Sponsored Links

Recommended Links