JavaScript Made Easy: Free JavaScripts Tutorials Example Code

Metachecker.net

|

FontsMadeEasy.com

|

RankChecker.net

Learn Java Script Today

|

Over 5000 Free Fonts

|

|

Javascript Forum

|

Other Javascript Resources

|

JavaScript Basics

Inserting Javascript

Complete Tutorial

Advance DHTML Tutorial



Dynamic Fader

Nicholas's cool Dynamic Fader script gently brings into view various messages, then fades them out after a few seconds. Also supports the display of HTML content (such as links), apart from plain text. Cool!


Insert into <HEAD>
<STYLE> <!-- .TextScrollStyle { visibility:visible; font-size:13pt; font-family:Verdana; font-weight:bold; padding-top:0; } --> </STYLE> <SCRIPT LANGUAGE="JavaScript1.2"> /* Dynamic Fader Script Created and submitted by Nicholas Poh (hwinmain@yahoo.com) Permission granted to Dynamicdrive.com to feature script in archive For full source code and installation instructions to this script, visit http://dynamicdrive.com / var hexbase= new Array("0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E", "F"); var value=0; var Dec2Hex=new Array(); for (x=0; x<16; x++){ for (y=0; y<16; y++){ Dec2Hex[value]= hexbase[x] + hexbase[y]; value++; } } function RGB2STR(rgbcolor) { return Dec2Hex[rgbcolor>>16] + Dec2Hex[(rgbcolor>>8)&0xFF] + Dec2Hex[rgbcolor&0xFF]; } /////Congifure following variables to customize fader// var scrollerwidth=200 var scrollerheight=90 var TS_colorFG = 0x0000FF; // Text color var TS_colorBG = 0xFFFFFF; // Background color var TS_ymax = 50; // Total animation frame var TS_ystep = 1; // 1 or -1 only var TS_speed = 2; var TS_message = new Array(); // Put messages here TS_message[0] = 'Hello there'; TS_message[1] = 'Wow... hope you like it!'; TS_message[2] = '<A HREF="http://dynamicdrive.com">dynamicdrive.com</A>'; /////End configuration////////////////// var TS_ypos = 0; var TS_yposOrg = 0; var TS_color = TS_colorBG; var TS_curMsg = 0; // Calculate the difference between background and foreground color var dfRed = -((TS_colorBG>>16) - (TS_colorFG>>16)) / (TS_ymax>>1); var dfGreen = -(((TS_colorBG>>8)&0xFF) - ((TS_colorFG>>8)&0xFF)) / (TS_ymax>>1); var dfBlue = -((TS_colorBG&0xFF) - (TS_colorFG&0xFF)) / (TS_ymax>>1); var TS_opColor = (dfRed<<16) + (dfGreen<<8) + (dfBlue); var timer; function UnloadMe() { clearTimeout(timer); } function ScrollText() { if (document.all) { // IE TextScroll.style.paddingTop = TS_ypos; TextScroll.style.color = TS_color; } TS_ypos += TS_ystep; TS_color += TS_opColor; if (TS_ypos == (TS_ymax>>1) - TS_ystep) { TS_opColor = -1; } if (TS_ypos >= TS_ymax-1 \|\| TS_ypos <= 0) { TS_color = TS_colorBG; TS_opColor *= -1; if (TS_ystep > 0) { TS_ypos = 0; } else { TS_ypos = TS_ymax; } if (++TS_curMsg > TS_message.length-1) { TS_curMsg = 0; } // Change text if (document.all) { // IE TextScroll.style.paddingTop = TS_ypos; TextScroll.innerHTML=TS_message[TS_curMsg]; } } // Set timer timer = setTimeout('ScrollText()', TS_speed); } function ScrollTextDisplay() { var navName=navigator.appName; var navVer=parseInt(navigator.appVersion) if (!(navName=="Microsoft Internet Explorer" && navVer>=4)){ return; } if (navName=="Microsoft Internet Explorer") { TS_speed = 20 + TS_speed; } document.write('<SPAN ID="TextScroll" CLASS="TextScrollStyle" style="width:'+scrollerwidth+';height:'+scrollerheight+'">'); document.write(TS_message[0]); document.write('</SPAN>'); if (TS_ystep > 0) { TS_ypos = 0; } else { TS_ypos = TS_ymax; } if (document.all) { // IE TextScroll.style.backgroundColor = TS_colorBG; TextScroll.style.color = TS_color; } window.onload=new Function("timer = setTimeout('ScrollText()', 1000);") window.onunload=UnloadMe; } </SCRIPT>

Insert into <BODY>
<SCRIPT language="JavaScript1.2"> if (document.all) ScrollTextDisplay() </SCRIPT>

Other Options