• Des SCRIPTS gratuits, expliqués et personnalisables.
    •
Visualisez, puis téléchargez les fichiers correspondants (zip).
        • Il ne restera plus qu'à inclure les codes dans vos pages !
           
• Free and customable SCRIPTS.
                • For more convenience, zip files are proposed.
                    • Download and include script on your page.

LISTE des SCRIPTS
Cliquer ici

CETTE RUBRIQUE...

01 Zone de texte
02 Zone de texte
03 Superposition
04 Rebond
05 Message enchaînés
06 Message
07 Défilant pleine page
08 Defilant vertical
09 Défilant horizontal
10 Défilant horizontal
11 Défilant vertical
12 Message
13 Boite de dialogue
14 Post-It
15 Machine à écrire_02
Machine à écrire_01
Message hebdomadaire
Messages cycliques
23 Bas d'écran
24 Message complexe
25 Message à rideau
26 Message coloré
27 Message coloré
28 Message LED
29 Message coloré
30 Message à ressort
31 Spot sur message
32 Zone de texte
33 Zone de texte
34 Message tremblant
35 Deux messages en zone de texte
36 Message dans zone de texte
37 Message défilant superposé
>> Messages suivants

EFFET DE TRANSITION SUR VOTRE MESSAGE

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>