// CREDITS:
// Messagebox with fadeing Background
// By Peter Gehrig
// Copyright (c) 2004 Peter Gehrig. All rights reserved.
// Permission given to use the script provided that this notice remains as is.
// Additional scripts can be found at http://www.24fun.com
// info@24fun.com
// 1/08/2004

// IMPORTANT:
// If you add this script to a script-library or script-archive
// you have to add a highly visible link to
// http://www.24fun.com on the webpage
// where this script will be featured

// set your messages. Add as many as you like (you may add additional HTML-tags)
var text=new Array()
text[0]="message 1"
text[1]="message 2"
text[2]="message 3"
text[3]="message 4"


// set the corresponding links
// If you don't want to link a message just add a "#" instead of an URL
var textlink=new Array()
textlink[0]="http://www.computinghost.com" //link for message 1
textlink[1]="#" //link for message 2
textlink[2]="http://www.trap17.com"  //link for message 3
textlink[3]="http://www.astahost.com"  //link for message 4


// set the corresponding targets
// Acceptable values are "_blank", "_self", "_top" or the name of any frame
var texttarget=new Array()
texttarget[0]="_blank"
texttarget[1]="_self"
texttarget[2]="_top"

// set the font of the messages
var textfont="Verdana"

// set the font-color of the messages
var textfontcolor="#000000"

// set the rollover-fontcolor of the messages
var textfontcolorrollover="#FF0000"

// set the font-size of the messages (CSS-values)
var textfontsize=8.5

// set the font-size for Netscape 4x (HTML-values)
var textfontsizeHTML=2

// set the font backgroundcolor of the textbox
var textbgcolor="#FFFFFF"

// set the textweight (normal or bold)
var textweight="nomal"

// set the fontstyle (normal or italic)
var textitalic="normal"

// set the width of the textbox (pixels)
var textwidth=700

// set the height of the textbox (pixels)
var textheight=50

// set the pause (seconds)
var textpause=7

// set the width of the border
var textborder=1

// set the color of the border
var textbordercolor="#FF0000"

// set the horizontal alignment of the messages (center, left, right)
var textalign="center"

// set the vertival alignment of the messages (middle, top, bottom)
var textvalign="middle"

// do not edit below this line
var textdecoration="none"
var textweightA="<b>"
var textweightB="</b>"
var textitalicA=""
var textitalicB=""
var transparency=100
var transparencystep=2

var x_pos=0
var y_pos=0
var i_text=0
var textsplit=""
var i_textsplit=0
var i_mark=0
var tickercontent
var pausefade=30
textpause*=1000

var oneloopfinished=false

var browserinfos=navigator.userAgent
var ie=document.all&&!browserinfos.match(/Opera/)
var ns4=document.layers
var ns6=document.getElementById&&!document.all&&!browserinfos.match(/Opera/)
var opera=browserinfos.match(/Opera/)  
var browserok=ie||ns4||ns6||opera

function changecontent() {
getcontent()
i_text++
if (i_text>=text.length) {i_text=0}
if (ie) {
 ticker.innerHTML=content
 fadeout()
}
if (opera || ns6) {
 document.getElementById('ticker').innerHTML=content
 var texttimer=setTimeout("changecontent()",2*textpause)
}
if (ns4) {
 document.roof.document.ticker.document.write(content)
 document.roof.document.ticker.document.close()
 var texttimer=setTimeout("changecontent()",textpause)
}
}

function fadein() {
if (transparency<100){
 transparency+=transparencystep
 if (ie) {
  document.all.tickerbg.filters.alpha.opacity=transparency
 }
 var fadetimer=setTimeout("fadein()",pausefade)
}
else {
 clearTimeout(fadetimer)
 setTimeout("changecontent()",1000)
}
}

function fadeout() {
if (transparency>0){
 transparency-=transparencystep
 if (ie) {
  document.all.tickerbg.filters.alpha.opacity=transparency
 }
 if (ns6) {
  document.getElementById('tickerbg').style.MozOpacity=transparency/100
 }
 var fadetimer=setTimeout("fadeout()",pausefade)
}
else {
 clearTimeout(fadetimer)
 setTimeout("fadein()",textpause)
}
}

getcontent()
function getcontent() {
if (ie || opera) {
 var tablewidth=textwidth-2*textborder
 var tableheight=textheight-2*textborder
}
else {
 var tablewidth=textwidth
 var tableheight=textheight
}
if (ie || ns6) {
 var padding = parseInt(textborder)+3
 content = "<table width=" + tablewidth + " height=" + tableheight + " cellpadding=" + padding + " cellspacing=0 border=0><tr valign=" + textvalign + "><td align=" + textalign + ">"
 content += "<a href=\"" + textlink[i_text] + "\" target=\"" + texttarget[i_text] + "\" style=\"position:relative;font-family:\'" + textfont + "\';font-size:" + textfontsize + "pt;font-weight:" + textweight + ";text-decoration:" + textdecoration + ";color:" + textfontcolor + ";font-style:" + textitalic + ";\" onMouseOver=\"this.style.color=\'"+textfontcolorrollover+"\'\" onMouseOut=\"this.style.color=\'" + textfontcolor + "\'\">"
 content += text[i_text]
 content += "</a></td></tr></table>"
}
else {
 content = "<table width=" + tablewidth + " height=" + tableheight + " cellpadding = " + textborder + " cellspacing=0><tr valign=" + textvalign + "><td align=" + textalign + ">"
 content+="<a href=\"" + textlink[i_text] + "\" target=\"" + texttarget[i_text] + "\" style=\"position:relative;font-family:\'" + textfont + "\';font-size:" + textfontsize + "pt;font-weight:" + textweight + ";text-decoration:"+textdecoration + ";color:" + textfontcolor + ";font-style:" + textitalic+";\">"
 content+=text[i_text]
 content+="</a></td></tr></table>"

 framecontent = "<table width=" + tablewidth + " height=" + tableheight + " cellpadding = 0 cellspacing=0 border=" + textborder + "><tr><td>"
 framecontent += "<font color=\"" + textbgcolor + "\">"
 framecontent += "."
 framecontent+="</font>"
 framecontent+="</td></tr></table>"
}
}

if (ie || ns6 || opera) {
if (ns6) {
 textwidth-=2*textborder
 textheight-=2*textborder
}
document.write("<div id=\"roof\" style=\"position:relative;width:"+textwidth+"px;height:"+textheight+"px;font-family:\'"+textfont+"\';border-style:solid;border-color:"+textbordercolor+";border-width:"+textborder+"px;background-color:"+textbgcolor+";\">")

if (!opera && !ns6 ) {
 document.write("<div id=\"tickerbg\" style=\"position:absolute;top:"+-textborder + "px;left:"+-textborder + "px;width:" + textwidth + "px;height:" + textheight + "px;font-family:\'" + textfont + "\';font-size:" + textfontsize + "pt;font-weight:" + textweight + ";font-style:" + textitalic + ";border-style:solid;border-color:" + textbordercolor + ";border-width:" + textborder + "px;background-color:" + textfontcolor + ";overflow:hidden\;filter:alpha(opacity=100)\">")
 document.write("</div>")
}

document.write("<div id=\"ticker\" style=\"position:absolute;top:"+-textborder+"px;left:"+-textborder + "px;width:" + textwidth + "px;height:" + textheight + "px;font-family:\'" + textfont + "\';font-size:" + textfontsize + "pt;font-weight:" + textweight + ";font-style:" + textitalic + ";border-style:solid;border-color:" + textbordercolor+";border-width:" + textborder+"px;overflow:hidden\;\">")
document.write("</div></div>")

window.onload=changecontent
}

else if (ns4) {
document.write("<ilayer name=\"roof\" width="+textwidth+" height="+textheight+">")
 document.write("<layer name=\"tickerframe\" width="+textwidth+" height="+textheight+" top=0 left=0 bgcolor="+textbgcolor+">")
 document.write(framecontent)
 document.write("</layer>")
 document.write("<layer name=\"ticker\" width="+textwidth+" height="+textheight+" top=0 left=0>")
 document.write()
 document.write("</layer>")
document.write("</ilayer>")
window.onload=changecontent
}

<html>
 <head>
   <title>Fading Message</title>
 </head>
 <body>
   <script language="javascript" src="message.js"></script>
 </body>
</html>

<script language="javascript" src="message.js"></script>