 |
 Des images qui 'pendouillent' au pointeur |
|
|
|
Connexion ratee
|
|
La souris se voit affublée d'images qui pendent, remuent comme pour de vrai ! |
|
|
|
|
|
Ce script n'est pas du tout de moi, je ne me souviens plus ou je l'ai trouvé, donc
pardon au propriétaire de ne pas le citer, s'il se reconnait, qu'il n'hésite pas.
Le principe est complexe, je ne rentrerais pas dans les détails.
- var nDots : le nombre d'images,
- var DELTAT : la flexibilité du mouvement,
- var SEGLEN : l'espace relatif entre les images,
- var SPRINGK : le dynamisme du mouvement (ne montez pas trop la valeur),
- var MASS : le poids des images,
- var GRAVITY : devinez...,
- var RESISTANCE : disons la résistance de l'air,
- var BOUNCE : force de renvoi des rebonds sur les bords.
|
|
|
|
|
|
dans la partie <head>
 |
|
 |
|
<script language="JavaScript">
var nDots = 5;
var Xpos = 0;
var Ypos = 0;
var DELTAT = .01;
var SEGLEN = 10;
var SPRINGK = 10;
var MASS = 1;
var GRAVITY = 50;
var RESISTANCE = 10;
var STOPVEL = 0.1;
var STOPACC = 0.1;
var DOTSIZE = 10;
var BOUNCE = 0.75;
var isNetscape = navigator.appName=="Netscape";
var followmouse = true;
function initboules() {
var i = 0;
dots = new Array();
for (i = 0; i < nDots; i++) {
dots[i] = new dot(i);
}
for (i = 0; i < nDots; i++) {
dots[i].obj.left = dots[i].X;
dots[i].obj.top = dots[i].Y;
}
setTimeout("startanimate()", 500);
}
function dot(i) {
this.X = Xpos;
this.Y = Ypos;
this.dx = 0;
this.dy = 0;
if (isNetscape) {
this.obj = eval("document.dot" + i);
if(i>0) {
this.obj.visibility="show";
}
}
else {
this.obj = eval("dot" + i + ".style");
if(i>0) {
this.obj.visibility="visible";
}
}
}
function startanimate() {
setInterval("animate()", 20);
}
function MoveHandler(e) {
Xpos = e.pageX;
Ypos = e.pageY;
return true;
}
function MoveHandlerIE() {
Xpos = window.event.x;
Ypos = window.event.y;
}
if (isNetscape) {
document.captureEvents(Event.MOUSEMOVE);
document.onMouseMove = MoveHandler;
}
else {
document.onmousemove = MoveHandlerIE;
}
function vec(X, Y) {
this.X = X;
this.Y = Y;
}
function springForce(i, j, spring) {
var dx = (dots[i].X - dots[j].X);
var dy = (dots[i].Y - dots[j].Y);
var len = Math.sqrt(dx*dx + dy*dy);
if (len > SEGLEN) {
var springF = SPRINGK * (len - SEGLEN);
spring.X += (dx / len) * springF;
spring.Y += (dy / len) * springF;
}
}
function animate() {
var start = 0;
if (followmouse) {
dots[0].X = Xpos;
dots[0].Y = Ypos;
start = 1;
}
for (i = start ; i < nDots; i++ ) {
var spring = new vec(0, 0);
if (i > 0) {
springForce(i-1, i, spring);
}
if (i < (nDots - 1)) {
springForce(i+1, i, spring);
}
var resist = new vec(-dots[i].dx * RESISTANCE, -dots[i].dy * RESISTANCE);
var accel = new vec((spring.X + resist.X)/ MASS, (spring.Y + resist.Y)/ MASS + GRAVITY);
dots[i].dx += (DELTAT * accel.X);
dots[i].dy += (DELTAT * accel.Y);
if (Math.abs(dots[i].dx) < STOPVEL && Math.abs(dots[i].dy) < STOPVEL && Math.abs(accel.X) < STOPACC && Math.abs(accel.Y) < STOPACC) {
dots[i].dx = 0;
dots[i].dy = 0;
}
dots[i].X += dots[i].dx;
dots[i].Y += dots[i].dy;
var height, width;
if (isNetscape) {
height = window.innerHeight;
width = window.innerWidth;
}
else {
height = document.body.clientHeight;
width = document.body.clientWidth;
}
if (dots[i].X < 0) {
if (dots[i].dx < 0) {
dots[i].dx = BOUNCE * -dots[i].dx;
}
dots[i].X = 0;
}
dots[i].obj.left = dots[i].X;
dots[i].obj.top = dots[i].Y;
}
}
function writeboules() {
setTimeout("initboules()",1000);
}
&:t;/script>
|
|
|
 |
|
 |
dans la partie <body>
|
|
|
|
<div id=dot0 style="position: absolute; visibility: hidden;"> </div>
<div id=dot1 style="position: absolute; visibility: hidden;"><img src="images/2.gif" border=0></div>
<div id=dot2 style="position: absolute; visibility: hidden;"><img src="images/0.gif" border=0></div>
<div id=dot3 style="position: absolute; visibility: hidden;"><img src="images/0.gif" border=0></div>
<div id=dot4 style="position: absolute; visibility: hidden;"><img src="images/1.gif" border=0></div>
<script language="JavaScript">initboules();</script>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Vous n'avez rien remarqué sur cette page ?
|
|
|
|
|
|
|
|
|
|
|
Error 500 - Internal server error
Error 500 - Internal server error
Un problème inattendu est survenu.
Veuillez réessayer ultérieurement.
Error 500 - Internal server error
Error 500 - Internal server error
Un problème inattendu est survenu.
Veuillez réessayer ultérieurement.
Error 500 - Internal server error
Error 500 - Internal server error
Un problème inattendu est survenu.
Veuillez réessayer ultérieurement.
|
