Démo : En cours...
Etape 1 : Ajouter dans le <head> :
<script> <!-- // Copyright Peter Gehrig and Urs Dudli at www.24fun.com. // If you add this script to a script-library // you have to insert a link to www.24fun.com // Nos messages ici ! var message=new Array() message[0]="Vous êtes bien sur le site Scripts DHTML !" message[1]="Une compilation des meilleurs scripts du Web" // La distance par rapport aux bords. var tickerpadding=10 // La police de caractères. var fnt="Arial" // La taille de la police. var fntsize=70 // La couleur du texte. var fntcolor="CCDDCC" // La taille du dernier caractère affiché. var fntsizelastletter=70 // La couleur du dernier caractère affiché. var fntcolorlastletter="CCDDCC" // La graisse du caractère. // Valeur de 1 à 9 (gras) var fntweight=7 // Le temps de pause entre les messages (en microsecondes) var standstill=2000 // speed (a higher value will slow down the ticker) var speed=40 ////////////////////////////////////////////////// var leftposition=0 var topposition=0 var tickerwidth var tickerheight var i_substring=0 var i_presubstring=0 var i_message=0 var messagecontent="" var messagebackground="" var messagepresubstring="" var messageaftersubstring="" fntweight=fntweight*100 function initiateticker() { if (document.all) { tickerheight = document.body.clientHeight-5 tickerwidth = document.body.clientWidth-5 document.all.ticker.style.posLeft=leftposition document.all.ticker.style.posTop=topposition showticker() } if (document.layers) { tickerheight = window.innerHeight-10 tickerwidth = window.innerWidth-10 document.ticker.left=leftposition document.ticker.top=topposition showticker() } } function getmessagecontent() { messagepresubstring=message[i_message].substring(0,i_presubstring) messageaftersubstring=message[i_message].substring(i_presubstring,i_substring) messagecontent="<table border=0 cellpadding="+tickerpadding+" width="+tickerwidth+" height="+tickerheight+"><tr><td valign=top align=center>" messagecontent+="<span style='position:relative; font-family:"+fnt+";color:"+fntcolor+";font-size:"+fntsize+"pt;font-weight:"+fntweight+"'>" messagecontent+="<font color='"+fntcolor+"'>" messagecontent+=messagepresubstring messagecontent+="</font>" messagecontent+="</span>" messagecontent+="<span style='position:relative; font-family:"+fnt+";color:"+fntcolor+";font-size:"+fntsizelastletter+"pt;font-weight:900'>" messagecontent+="<font color='"+fntcolorlastletter+"'>" messagecontent+=messageaftersubstring messagecontent+="</font>" messagecontent+="</span>" messagecontent+="</td></tr></table>" } function showticker() { if (i_substring<=message[i_message].length-1) { i_substring++ i_presubstring=i_substring-1 if (i_presubstring<0) {i_presubstring00} getmessagecontent() if (document.all) { ticker.innerHTML=messagecontent var timer=setTimeout("showticker()", speed) } if (document.layers) { document.ticker.document.write(messagecontent) document.ticker.document.close() var timer=setTimeout("showticker()", speed) } } else { clearTimeout(timer) var timer=setTimeout("changemessage()", standstill) } } function changemessage() { i_substring=0 i_presubstring=0 i_message++ if (i_message>message.length-1) { i_message=0 } showticker() } // --> </script>
On peut configurer de nombreuses variables dans le script.
Etape 2 : Ajouter dans la balise <body> :
<body onLoad="initiateticker()">
Etape 3 : Ajouter après la balise <body> :
<DIV ID="ticker" style="position:absolute"></DIV>
Etape 4 : Inclure votre page normale dans un <DIV> ... </DIV>
Par exemple :<DIV id="page_normale" style="position:absolute;top:8px;left:8px;">Votre page ici !</DIV>