Animation du jour

Ci-joint une proposition d'insertion au début du body

<script type="text/javascript" src="psns/poissons.js"></script>

Le dossier psns contenant le script suivant

var chn='';
var nmPsng="psns/psng.gif",nmPsnd="psns/psnd.gif";
var heightPsn=17,widthPsn=33;
var objPsn=new Array(),numObjPsn=7;
var xlimPsn=64,ylimPsn=32;
var xPsn=xlimPsn,yPsn=ylimPsn;
var uPsn=xlimPsn,vPsn=ylimPsn,fPsn=0;

function animObjPsn () {
    if (fPsn==0){
		(this.d) ? this.x+=2 : this.x-=2;
		if (this.x>=xlimPsn) {
			this.x=xlimPsn;this.changedir();}
		if (this.x<=-xlimPsn) {
			this.x=-xlimPsn;this.changedir();}
		if (Math.round(Math.random()*(this.s+1)*60) == 1) this.changedir();}
	var t=Math.round(Math.random()*(this.s+1)*10);
	if (t==2 && this.y<ylimPsn) this.y++;
	if (t==1 && this.y>-ylimPsn) this.y--;
	this.obj.style.left=(this.x+xPsn)+'px';
	this.obj.style.top=(this.y+yPsn)+'px';
}
function changedirObjPsn() {
    if (this.d==0) {this.d=1;
        this.img.src=nmPsnd;}
    else {this.d=0;
        this.img.src=nmPsng;}
}
function defObjPsn(id) {
	this.obj=document.getElementById('idPsn'+id);
	this.img=document.getElementById('imPsn'+id);
    this.d=Math.round(Math.random());
    this.s=Math.round(Math.random());
    this.x=Math.round(Math.random()*2*xlimPsn) - xlimPsn;
    this.y=Math.round(Math.random()*2*ylimPsn) - ylimPsn;
    this.img.src=(this.d==0) ? nmPsng : nmPsnd;
    this.anim=animObjPsn;
    this.changedir=changedirObjPsn;
}
function animPsn() {var e=uPsn-xPsn,x,i;
    if (2<Math.abs(e)) {
        x=Math.round(e/10);if (Math.abs(x)<2) 0<(x=e)?2:-2;
        xPsn+=x;fPsn=1}
    else {xPsn=uPsn;fPsn=0}

    if (vPsn!=yPsn) yPsn+=Math.round((vPsn-yPsn)/10);
    for(i=0;i<numObjPsn;i++) {
		if (e!=0) {
			if (e<0 && objPsn[ i].d==1) objPsn[ i].changedir();
			if (0<e && objPsn[ i].d==0) objPsn[ i].changedir();}
		objPsn[ i].anim();}
}
function mouseEventPsn(e) {
	if (!e) e=window.event;
		uPsn=e.clientX+document.getElementById('bdy').scrollLeft ;
		vPsn=e.clientY+document.getElementById('bdy').scrollTop ;
}
for (var x=0; x<numObjPsn; x++) {
	chn+='<div id="idPsn'+x+'" style="position: absolute; visibility: visible;">';
	chn+='<img id="imPsn'+x+'" src="'+nmPsnd+'" height="'+heightPsn+'" width="'+widthPsn+'" border="0"></div>';}
	document.write(chn);

function initPsn() {
	document.body.id='bdy';
	if(!document.getElementById && document.all)
		document.getElementById=function(id) {return document.all[id];}
	for(var x=0; x<numObjPsn; x++) objPsn[x]=new defObjPsn(x);
		document.onmousemove=mouseEventPsn;
		setInterval("animPsn();",50);
}
window.onload=initPsn;

ainsi que les deux images psng et psnd suivantes :
et
Modifié par Julien de Prabere (01 Apr 2009 - 12:14)