Fading Dynamic Content 2.0 Javascript

Javascripts > Javascript Links > Fading Dynamic Content 2.0

Script Title: Fading Dynamic Content 2.0

Description: This JavaScript creates a slide-show effect displaying different contents dynamically. The content fades in while being displayed. This version (v 2.0) supports IE, Netscape 4.x and Netscape 6.x.

Example: Available

Copy the following code between the <BODY></BODY> tags of your html page.

<style type="text/css"> .link{font-family:verdana,arial,helvetica; font-size:8pt; color:#003399; font-weight:normal} .link:hover{font-family:verdana,arial,helvetica; font-size:8pt; color:#0099FF; font-weight:normal} .header{font-family:arial,verdana,helvetica; font-size:20pt; color:#404040; font-weight:bold} </style>  <script language="javascript"> // Use Freely as long as following messages are intact :: //--------------------------------------------------------------- // Fading Dynamic Content JavaScript v 2.0 | // Made minor changes, Works on IE and NS6 | // Added support for NS4 | // Added option to AutoStart on load or onClick | // This script written and © 2002 Premshree Pillai. | // All rights reserved. | // Created on : 28/04/02 | // Modified on : 11/05/02 | // Web : http://www.qiksearch.com/ | // Mail : premshree@hotmail.com | // FREE JavaScripts at http://www.qiksearch.com/javascripts.htm | // v 2.0 - Now supports NS4 | // v 1.2 - Option to Autostart on load or click to start | // v 1.1 - Supports IE and NS6, option to loop continuosly | // v 1.0 - Fading Dynamic Content | //--------------------------------------------------------------- // Location of script : http://www.qiksearch.com/javascripts/fading-dynamic-content20.htm //--------------------------------------CUTOMISE---------------------------------------------- var qiksearch_js_text = new Array ("Fading Dynamic Content", "by Premshree Pillai", "You can even add<br>multiple lines and Images too...", "www.qiksearch.com"); // The Fading Contents, HTML Tags supported var qiksearch_space_width = 390; // The width of the content space var qiksearch_space_height = 50; // The height of the content space var qiksearch_space_borderw=3; // Border width var qiksearch_space_borderc="#FF9900"; // Border Color var timeOutVal=150; // Delay in milliseconds var isLoop=false; // If you want to loop continuosly then true, else false var isAutoStart=false; // If you want the Fading to start else you have to click to start var qiksearch_js_text_static='<a href="javascript:resetAll();writeDiv();" style="text-decoration:none" accesskey="l"><font color="#808080" face="verdana,arial,helvetica" size="-1"><b>C<u>l</u>ick to Start</b></font></a>'; // The default content if AutoStart false //-------------------------------------------------------------------------------------------- //-----------------------------DO-NOT-MODIFY-BELOW-THIS--------------------------------------- var ie4=document.all&&navigator.userAgent.indexOf("Opera")==-1; var ns6=document.getElementById&&navigator.userAgent.indexOf("Opera")==-1; var ns4=document.layers; var qiksearch_DyObj; var qiksearch_space_ns4_left=(screen.width/2-20)-Math.round(qiksearch_space_width/2); function setDyObj() { if(ie4) { qiksearch_DyObj=document.all.qiksearch_js_space; } if(ns6) { qiksearch_DyObj=document.getElementById("qiksearch_js_space"); } } if(ie4||ns6) { document.write('<table width="' + qiksearch_space_width + '" height="' + qiksearch_space_height + '" style="background:#FFFFFF; border:' + qiksearch_space_borderw + 'px solid ' + qiksearch_space_borderc + '"><tr><td align="middle">'); document.write('<div id="qiksearch_js_space">'); document.write('</div>'); document.write('</td></tr></table>'); } var def_10='A',def_11='B',def_12='C',def_13='D',def_14='E',def_15='F'; var colorVal=15; var div_count=0; function qiksearch_fade_desat(getColorIntVal) { var returnVal; if(getColorIntVal>=10) { for(var i=0; i<=15; i++) { if((getColorIntVal==i)) { returnVal = eval('def_' + i); } } } else { returnVal=getColorIntVal; } return(returnVal); } function writeDiv() { if(ns4) { qiksearch_DyObj=document.qiksearch_space_ns4; } if(ie4||ns6) { qiksearch_DyObj.innerHTML= '<font face="verdana,arial,helvetica" size="-1" color="#' + joinColor(qiksearch_fade_desat(colorVal)) + '"><b>' + qiksearch_js_text[div_count] + '</span></b></font>' ; } if(ns4) { qiksearch_DyObj.document.write('<table width="100%" border="1" bordercolor="' + qiksearch_space_borderc + '"><tr><td align="center"><font face="verdana,arial,helvetica" size="-1" color="#' + joinColor(qiksearch_fade_desat(colorVal)) + '"><b>' + qiksearch_js_text[div_count] + '</span></b></font></td></tr></table>'); qiksearch_DyObj.document.close(); } if((colorVal>0) && (colorVal!=0)) { colorVal--; } else { colorVal=15; if(div_count<qiksearch_js_text.length) { div_count++; } if(div_count==qiksearch_js_text.length) { if(isLoop) { setTimeout("resetAll()",timeOutVal); setTimeout("writeDiv()",timeOutVal); } else { if(ie4||ns6) { qiksearch_DyObj.innerHTML = qiksearch_js_text_static; } if(ns4) { qiksearch_DyObj.document.write('<table width="100%" border="1" bordercolor="' + qiksearch_space_borderc + '"><tr><td align="center">' + qiksearch_js_text_static + '</td></tr></table>'); qiksearch_DyObj.document.close(); } } } } if(div_count<qiksearch_js_text.length) { setTimeout("writeDiv()",timeOutVal); } } function joinColor(getColor) { return (getColor + '0' + getColor + '0' + getColor + '0'); } function resetAll() { div_count=0; colorVal=15; } setDyObj(); function start_fader() { if(isAutoStart) { writeDiv(); } else { if(ie4||ns6) { qiksearch_DyObj.innerHTML = qiksearch_js_text_static; } if(ns4) { qiksearch_DyObj=document.qiksearch_space_ns4; qiksearch_DyObj.document.write('<table width="100%" border="1" bordercolor="' + qiksearch_space_borderc + '"><tr><td align="center">' + qiksearch_js_text_static + '</td></tr></table>'); qiksearch_DyObj.document.close(); } } } window.onload=start_fader; if(ns4) { document.write('<layer bgcolor="#FFFFFF" id="qiksearch_space_ns4" width="' + qiksearch_space_width + '" left="' + qiksearch_space_ns4_left + '"></layer>'); } </script>

Graphxkingdom
Thousands of free Icons, Clipart & Themes!

Free-Backgrounds
Hundreds of eye-popping Backgrounds & Textures

Java-scripts.net
Cool and easy effects with cut-and-paste Javascripts!