Un très bon scrolling vertical

DEMONSTRATION

 

Code source entre <BODY> et </BODY>
top


<span name="init" STYLE="position:absolute; visibility:hidden;">
<form name="init"><textarea name="init">

<!-- Ecrivez ci-dessous le contenu du scrolling-->
<FONT SIZE=2 FACE="ARIAL" COLOR="#FFFF00">
Bonjour.<BR>
Ce script porte toute ma fierté..<BR>
Vous pouvez lui donner la taille<BR>
que vous voulez, la position que<BR>
vous souhaitez et y faire défiler<BR>
ce que vous voulez. Par exemple,<BR>
une image, <IMG SRC="GOLD1.GIF" BORDER=0 WIDTH=17 HEIGHT=18><BR>
un lien, <A HREF="mailto:webmaster@webgraf.com">cliquez-ici</A><BR>
de la <FONT COLOR="#FF0000">couleur</FONT>,<BR>
ou tout ce que vous désirez !<BR>
Vous pouvez paramétrer le sens, <BR>
la vitesse, la taille totale et<BR>
la taille d'un seul motif.<BR><BR>
Auteur : <B>Gros Mathieu</B>.</FONT>
<!-- Fin du contenu du scrolling-->

</textarea></form></span>
<SCRIPT LANGUAGE="JavaScript">
<!--
//Interdiction d'effacer ces lignes
//D'autres script,applet,images sur webgraf.Com 
//Auteur: Mathieu Gros, webmaster@webgraf.Com

var sizeX=200 // Taille horizontal du message
var sizeY=280 // Taille vertical du message
var SizeTotal=130 // Hauteur total du scrolling 
var posX=100 // Position horizontal en Pixel en partant de la gauche 
var posY=100 // Position vertical en Pixel en partant du haut 
var step=2 // Négatif=descendant Positif=montant
var speed=100  // Vitesse (nombre élevé=vitesse faible)

 //Pas touche à la suite
if (step>0){tp1=0;frm2=SizeTotal+posY;frm1= frm2-sizeY;
tp3="rect(0 "+sizeX+" 0 0)";vr1="bottom"
vr2="top";frm3=posY;frm5=1;}
else{tp1=sizeY;frm2=posY-sizeY
tp3="rect("+sizeY+" "+sizeX+" "+sizeY+" 0)"
vr2="bottom";vr1="top";frm5=-1;frm4=SizeTotal+posY;}
var texte=document.init.document.forms['init'].init.value
Ytop= new Array();Ybottom= new Array()
Y= new Array();Ytop[1]=tp1;Ybottom[1]=tp1;Y[1]=frm2
if (navigator.appName == "Netscape") {
document.write('<layer left="'+posX+'" visibility=hide name="ly01">'+texte+'</layer>')
with(document.ly01){visibility="show";clip.width=sizeX;
clip.top=tp1;clip.bottom=tp1;top=frm2;nav=1;};}
else {nav=0;document.write('<div ID="ly01" STYLE="position:absolute; left:'
+posX+'; visibility:hidden;">'+texte+'</div>');with(document.all.ly01.style){
visibility="visible";clip=tp3;posTop=frm2;};}		
nbl=Math.ceil(SizeTotal/sizeY)+1 
for (i=2;i<=nbl;i++){ 
Ytop[i]=tp1;Ybottom[i]=tp1
if (step>0) tmp=SizeTotal+posY+(i-1)*sizeY
else tmp=posY-i*sizeY;Y[i]=tmp;if (nav) {
document.write('<layer left="'+posX+'" visibility=hide name="ly0'+i+'">'+texte+'</layer>')
with(eval("document.ly0"+i)){
visibility="show";clip.width=sizeX;clip.top=tp1; clip.bottom=tp1;top=tmp;};}
else {document.write('<div ID="ly0'+i+'" STYLE="position:absolute; left:'
+posX+'; visibility:hidden;">'+texte+'</div>')
with(eval("document.all.ly0"+i+".style")){visibility="visible";clip=tp3;posTop=tmp;};};}
function vscroll(){for (i=1;i<=nbl;i++){
Y[i]-=step;if (step>0) frm4=2*Y[i]+Ybottom[i]-posY-step
else {frm1=posY-Ybottom[i];frm2=frm1+sizeY
frm3=2*Y[i]-SizeTotal-posY+sizeY;}			 
if ((Y[i]>=frm1)&&(Y[i]<=frm2)) eval("Y"+vr1+"[i]+=step")
if (Y[i]<=frm3) eval("Y"+vr2+"[i]+=step")
if (Y[i]>=frm4) {Ytop[i]=tp1;Ybottom[i]=tp1
Y[i]+=frm5*nbl*sizeY-frm5*step;}
if (nav){with(eval("document.ly0"+i)){
clip.bottom=0;clip.top=0;clip.bottom=Ybottom[i]
clip.top=Ytop[i];top=Y[i];};} 
else {with(eval("document.all.ly0"+i+".style")){
posTop=Y[i];clip="rect("+Ytop[i]+" "+sizeX+" "+Ybottom[i]+" 0)";};};}
setTimeout("vscroll()",speed);}
vscroll()
//-->
</script>
 
INFORMATIONS COMPLEMENTAIRES
top

Comment intégrer ce script dans votre page: Vous pouvez télécharger cet exemple au format zip :télécharger.








Un problème ou une critique : e-mail
Des ressources utiles et gratuites pour vos pages Web :
webgraf.com