|
|||||||||||||||||
|
|
|||||||||||||||||
|
|
|||||||||||||||||
|
Cliquez sur "download" pour télécharger le kit nécessaire. Compatible IE et NS (v4.75: oui; v6: non, mais sans erreur). Personnalisable: nombre de messages, couleur du fond, police, couleur, taille des caractères, une URL différente par message (ou pas d'URL), vitesse d'enchaînement, nombre de lamelles, etc. Positionnement sur la page: seule l'option "absolute" fonctionne (pas très génant...). Pendant l'effet, les liens situés en-dessous restent accessibles. 1/ Inscrire entre HEAD et HEAD : ou entre BODY et /BODY...
<script>
<!--
// Copyright Peter Gehrig and Urs Dudli at www.24fun.com/
// Vos messages ici
var message = new Array()
message[0]="KITWEB..."
message[1]="Scripts Backgrounds"
message[2]="Cliparts Fontes"
message[3]="Sons Liens etc"
// Les liens associés au messages (sinon utilisez "#")
var messageurl = new Array()
messageurl[0]="http://kitweb.free.fr"
messageurl[1]="http://kitweb.free.fr/scripts"
messageurl[2]="http://kitweb.free.fr/cliparts"
messageurl[3]="http://kitweb.free.fr/liens"
// La cible (target) des pages appelées (au choix: _self, _blank, _top etc)
var target_url="_top"
// La largeur de la bande de texte
var textwidth=355
// La hauteur de la bande de texte
var textheight=110
// Le cadre autour de l'effet
var borderwidth=0
// La taille de la police (codage font-size Html 3.0)
var font_size=6
// La police de caractères. Si elle n'est pas disponible chez l'internaute, Times sera utilisé.
var font_face="Verdana"
// La couleur des caractères
var font_color="navy"
// La couleur de l'arrière-plan
var bg_ticker="yellow"
// La position horizontale de la bande de texte
var x_finalpos=100
// La position verticale de la bande de texte
var y_finalpos=100
// Le nombre de lamelles
var x_slices=12
// Le temps de pause entre les messages (en millisecondes)
var pause=1500
//**** NE PLUS RIEN MODIFIER *****
var i_loop=0
var i_message=0
var width_slice=Math.ceil(textwidth/x_slices)
var cliptop=0
var clipbottom=textheight
var i_clipright=1
var content=""
function initiate() {
content+="<table border="+borderwidth+" cellpadding='3' width="+textwidth+" height="+textheight+">"
content+="<tr><td bgcolor="+bg_ticker+" align='center'>"
content+="<a href="+message[i_message]+" target="+target_url+">"
content+="<font face="+font_face+" size="+font_size+" color="+font_color+">"
content+=message[i_message]
content+="</font></a></td></tr></table>"
if (document.all) {
for (i=0;i<=x_slices;i++) {
var thisinners=eval("s"+i)
thisinners.innerHTML=content
var thiss=eval("document.all.s"+i+".style")
thiss.posLeft=x_finalpos
thiss.posTop=y_finalpos
}
i_message++
openlamellar()
}
if (document.layers) {
for (i=0;i<=x_slices;i++) {
var thisinners=eval("document.s"+i+".document")
thisinners.write(content)
thisinners.close()
var thiss=eval("document.s"+i)
thiss.left=x_finalpos
thiss.top=y_finalpos
}
i_message++
openlamellarNN()
}
}
function openlamellar() {
clipleft=-width_slice
clipright=0
if (i_clipright<=width_slice) {
for (i=0;i<=x_slices;i++) {
var thiss=eval("document.all.s"+i+".style")
thiss.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
clipleft+=width_slice
clipright=clipleft+i_clipright
}
i_clipright++
var timer=setTimeout("openlamellar()",20)
}
else {
clearTimeout(timer)
var timer=setTimeout("closelamellar()",2000)
}
}
function openlamellarNN() {
clipleft=-width_slice
clipright=0
if (i_clipright<=width_slice) {
for (i=0;i<=x_slices;i++) {
var thiss=eval("document.s"+i)
thiss.clip.left=clipleft
thiss.clip.right=clipright
thiss.clip.top=cliptop
thiss.clip.bottom=clipbottom
clipleft+=width_slice
clipright=clipleft+i_clipright
}
i_clipright++
var timer=setTimeout("openlamellarNN()",20)
}
else {
clearTimeout(timer)
var timer=setTimeout("closelamellarNN()",2000)
}
}
function closelamellar() {
clipleft=-width_slice
clipright=0
if (i_clipright>=0) {
for (i=0;i<=x_slices;i++) {
var thiss=eval("document.all.s"+i+".style")
thiss.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
clipleft+=width_slice
clipright=clipleft+i_clipright
}
i_clipright--
var timer=setTimeout("closelamellar()",20)
}
else {
clearTimeout(timer)
var timer=setTimeout("changeimage()",2000)
}
}
function closelamellarNN() {
clipleft=-width_slice
clipright=0
if (i_clipright>=0) {
for (i=0;i<=x_slices;i++) {
var thiss=eval("document.s"+i)
thiss.clip.left=clipleft
thiss.clip.right=clipright
thiss.clip.top=cliptop
thiss.clip.bottom=clipbottom
clipleft+=width_slice
clipright=clipleft+i_clipright
}
i_clipright--
var timer=setTimeout("closelamellarNN()",20)
}
else {
clearTimeout(timer)
var timer=setTimeout("changeimageNN()",2000)
}
}
function changeimage() {
content=""
if (i_message>message.length-1) {i_message=0}
content+="<table border="+borderwidth+" cellpadding='3' width="+textwidth+" height="+textheight+">"
content+="<tr><td bgcolor="+bg_ticker+" align='center'>"
content+="<a href="+message[i_message]+" target="+target_url+">"
content+="<font face="+font_face+" size="+font_size+" color="+font_color+">"
content+=message[i_message]
content+="</font></a></td></tr></table>"
for (i=0;i<=x_slices-1;i++) {
var thisinners=eval("s"+i)
thisinners.innerHTML=content
}
i_message++
openlamellar()
}
function changeimageNN() {
content=""
if (i_message>message.length-1) {i_message=0}
content+="<table border="+borderwidth+" cellpadding='3' width="+textwidth+" height="+textheight+">"
content+="<tr><td bgcolor="+bg_ticker+" align='center'>"
content+="<a href="+message[i_message]+" target="+target_url+">"
content+="<font face="+font_face+" size="+font_size+" color="+font_color+">"
content+=message[i_message]
content+="</font></a></td></tr></table>"
for (i=0;i<=x_slices-1;i++) {
var thisinners=eval("document.s"+i+".document")
thisinners.write(content)
thisinners.close()
}
i_message++
openlamellarNN()
}
// -->
</script>
<style>
.s {position:absolute;
left:-5000px;
topt:-5000px;
}
A {text-decoration:none;}
</style>
Les lignes de code sont bien expliquées, afin de permettre une personnalisation facile.
2/ Inscrire DANS la balise BODY : ou entre BODY et /BODY... <BODY onLoad="initiate()"> 3/ Inscrire entre BODY et /BODY : à l'emplacement où doit apparaître l'effet.
<script>
<!--
for (i=0;i<=x_slices;i++) {
document.write("<span id='s"+i+"' class='s'></span>")
}
// -->
</script>
|
|||||||||||||||||