|
• Des SCRIPTS gratuits, expliqués et personnalisables. |
Cliquez sur "download" pour télécharger le kit nécessaire
Compatible IE et NS (v4.75: oui; v6: non). Le nombre d'images est libre, elles seront identiques ou non, éventuellement associées à une URL en cas de click.
1/ Ajouter entre les balises <HEAD> et </HEAD>:
<script>
//"Moving Objects Script" de Virtual_Max (http://www.geocities.com/siliconvalley/lakes/8620)
// L'utlisation et la diffusion sont libres, pour une utilisation non commerciale,
// à condition de conserver ces lignes.
var brOK=false;
var mie=false;
var aver=parseInt(navigator.appVersion.substring(0,1));
var aname=navigator.appName;
function checkbrOK()
{if(aname.indexOf("Internet Explorer")!=-1)
{if(aver>=4) brOK=navigator.javaEnabled();
mie=true;
}
if(aname.indexOf("Netscape")!=-1)
{if(aver>=4) brOK=navigator.javaEnabled();}
}
var vmin=2;
var vmax=5;
var vr=2;
var timer1;
function Chip(chipname,width,height)
{this.named=chipname;
this.vx=vmin+vmax*Math.random();
this.vy=vmin+vmax*Math.random();
this.w=width;
this.h=height;
this.xx=0;
this.yy=0;
this.timer1=null;
}
function movechip(chipname)
{
if(brOK)
{eval("chip="+chipname);
if(!mie)
{pageX=window.pageXOffset;
pageW=window.innerWidth;
pageY=window.pageYOffset;
pageH=window.innerHeight;
}
else
{pageX=window.document.body.scrollLeft;
pageW=window.document.body.offsetWidth-35;
pageY=window.document.body.scrollTop;
pageH=window.document.body.offsetHeight-10;
}
chip.xx=chip.xx+chip.vx;
chip.yy=chip.yy+chip.vy;
chip.vx+=vr*(Math.random()-0.5);
chip.vy+=vr*(Math.random()-0.5);
if(chip.vx>(vmax+vmin)) chip.vx=(vmax+vmin)*2-chip.vx;
if(chip.vx<(-vmax-vmin)) chip.vx=(-vmax-vmin)*2-chip.vx;
if(chip.vy>(vmax+vmin)) chip.vy=(vmax+vmin)*2-chip.vy;
if(chip.vy<(-vmax-vmin)) chip.vy=(-vmax-vmin)*2-chip.vy;
if(chip.xx<=pageX)
{chip.xx=pageX;
chip.vx=vmin+vmax*Math.random();
}
if(chip.xx>=pageX+pageW-chip.w)
{chip.xx=pageX+pageW-chip.w;
chip.vx=-vmin-vmax*Math.random();
}
if(chip.yy<=pageY)
{chip.yy=pageY;
chip.vy=vmin+vmax*Math.random();
}
if(chip.yy>=pageY+pageH-chip.h)
{chip.yy=pageY+pageH-chip.h;
chip.vy=-vmin-vmax*Math.random();
}
if(!mie)
{eval('document.'+chip.named+'.top ='+chip.yy);
eval('document.'+chip.named+'.left='+chip.xx);
}
else
{eval('document.all.'+chip.named+'.style.pixelLeft='+chip.xx);
eval('document.all.'+chip.named+'.style.pixelTop ='+chip.yy);
}
chip.timer1=setTimeout("movechip('"+chip.named+"')",100);
}
}
function stopme(chipname)
{if(brOK) {
eval("chip="+chipname);
if(chip.timer1!=null)
{clearTimeout(chip.timer1)}
}
}
</script>
<script>
// ajouter ou supprimer des lignes selon le nombre d'images utilisées.
var chip1;
var chip2;
var chip3;
// ajouter ou supprimer des lignes selon le nombre d'images utilisées.
function pagestart(){
checkbrOK();
chip1=new Chip("chip1",60,80);
chip2=new Chip("chip2",60,80);
chip3=new Chip("chip3",60,80);
// ajouter ou supprimer des lignes selon le nombre d'images utilisées.
if(brOK) {
movechip("chip1");
movechip("chip2");
movechip("chip3");
}
}
</script>
Personnaliser:
* A la fin du script vous trouverez : chipx=new Chip("chip1",60,80) où 60 correspond au width et 80 au height de l'image du présent script et qu'il faudra adapter aux attributs de votre ou vos image(s).
2/ Ajouter juste après le body:
Il faut préciser l'adresse de l'image ainsi que ses attributs width et height. On peut aussi préciser la page html éventuellement appelée en cas de click sur l'image (facultatif).
<DIV ID="chip1" STYLE="position:absolute; width:60; height:80;"><A HREF="PageSuivante.html">
<IMG SRC="PremiereImage.gif" BORDER=0></a></DIV>
<DIV ID="chip2" STYLE="position:absolute; width:60; height:80;"><A HREF="PageSuivante.html">
<IMG SRC="SecondeImage.gif" BORDER=0></a></DIV>
<DIV ID="chip3" STYLE="position:absolute; width:60; height:80;"><A HREF="PageSuivante.html">
<IMG SRC="TroisiemeImage.gif" BORDER=0></a></DIV>
3/ Ajouter dans la balise body elle-même:
<body onLoad="pagestart();" onUnload="if(brOK) {stopme('chip1'); stopme('chip2'); stopme('chip3');}" >
Pour ajouter ou supprimer des images, il suffit (?) d'ajouter ou supprimer des variables chipx dans les différentes étapes.