Mon script "curseur élastique" ne marche plus [Résolu]

Signaler
Messages postés
7
Date d'inscription
mardi 28 septembre 2004
Statut
Membre
Dernière intervention
20 janvier 2014
-
Messages postés
1787
Date d'inscription
vendredi 9 mai 2008
Statut
Non membre
Dernière intervention
9 juin 2021
-
Bonjour,

le script "curseur élastique" ne marche plus avec les navigateurs chrome, firefox et maxthon3 (que j'utilise tous les jours). je travaille sur dreamweaver4 et xp pro sp3

je ne sais pas pourquoi cela ne marche plus. je demande de l'aide pour refaire ce script actualisé pour les 3 navigateurs

merci beaucoup
cordialement



voici le scrip initial :

<!-- DEBUT DU SCRIPT -->
<DIV id=dot0 style="HEIGHT: 2px; POSITION: absolute; VISIBILITY: hidden; WIDTH: 2px"><IMG border=0 src="images/oeuf1.gif"></DIV>
<DIV id=dot1 style="HEIGHT: 2px; POSITION: absolute; WIDTH: 2px"><IMG border=0 src="images/oeuf1.gif" width="27" height="24"></DIV>
<DIV id=dot2 style="HEIGHT: 2px; POSITION: absolute; WIDTH: 2px"><IMG border=0 src="images/oeuf1.gif" width="27" height="24"></DIV>
<DIV id=dot3 style="HEIGHT: 2px; POSITION: absolute; WIDTH: 2px"><IMG border=0 src="images/oeuf1.gif" width="27" height="24"></DIV>
<DIV id=dot4 style="HEIGHT: 2px; POSITION: absolute; WIDTH: 2px"><IMG border=0 src="images/oeuf1.gif" width="27" height="24"></DIV>
<DIV id=dot5 style="HEIGHT: 2px; POSITION: absolute; WIDTH: 2px"><IMG border=0 src="images/oeuf1.gif" width="27" height="24"></DIV>
<DIV id=dot6 style="HEIGHT: 2px; POSITION: absolute; WIDTH: 2px"><img src="images/oeuf1.gif" width="50" height="41"></DIV>
<SCRIPT language=JavaScript>


var nDots = 7;
var Xpos = 100;
var Ypos =100;
var DELTAT = .01;
var SEGLEN = 10;
var SPRINGK = 10;
var MASS = 0.8;
var GRAVITY = 100;
var RESISTANCE = 10;
var STOPVEL = 0.1;
var STOPACC = 0.1;
var DOTSIZE = 50;
var BOUNCE = 0.75;
var isNetscape = navigator.appName=="Netscape";
var followmouse = true;
var dots = new Array();
init();
function init() {
var i = 0;
for (i = 0; i < nDots; i++) {
dots[i] = new dot(i);
}
if (!isNetscape) {
}
for (i = 0; i < nDots; i++) {
dots[i].obj.left = dots[i].X;
dots[i].obj.top = dots[i].Y;
}
if (isNetscape) {
startanimate();
} else {
setTimeout("startanimate()", 3000);
}
}
function dot(i) {
this.X = Xpos;
this.Y = Ypos;
this.dx = 0;
this.dy = 0;
if (isNetscape) {
this.obj = eval("document.dot" + i);
} else {
this.obj = eval("dot" + i + ".style");
}
}
function startanimate() {

setInterval("animate()", 20);
}
function setInitPositions(dots) {
var startloc = document.all.tags("LI");
var i = 0;
for (i = 0; i < startloc.length && i < (nDots - 1); i++) {
dots[i+1].X = startloc[i].offsetLeft
startloc[i].offsetParent.offsetLeft - DOTSIZE;
dots[i+1].Y = startloc[i].offsetTop +
startloc[i].offsetParent.offsetTop + 2*DOTSIZE;
}
dots[0].X = dots[1].X;
dots[0].Y = dots[1].Y - SEGLEN;
}
function MoveHandler(e) {
Xpos = e.pageX;
Ypos = e.pageY;
return true;
}
function MoveHandlerIE() {
Xpos = window.event.x + document.body.scrollLeft;
Ypos = window.event.y + document.body.scrollTop;
}
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 + document.scrollTop;
width = window.innerWidth + document.scrollLeft;
} else {
height = document.body.clientHeight + document.body.scrollTop;
width = document.body.clientWidth + document.body.scrollLeft;
}
if (dots[i].Y >= height - DOTSIZE - 1) {
if (dots[i].dy > 0) {
dots[i].dy = BOUNCE * -dots[i].dy;
}
dots[i].Y = height - DOTSIZE - 1;
}
if (dots[i].X >= width - DOTSIZE) {
if (dots[i].dx > 0) {
dots[i].dx = BOUNCE * -dots[i].dx;
}
dots[i].X = width - DOTSIZE - 1;
}
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;
}
}
</script>

<!-- FIN DU SCRIPT -->
TAHITI lagoon

3 réponses

Messages postés
1787
Date d'inscription
vendredi 9 mai 2008
Statut
Non membre
Dernière intervention
9 juin 2021
131
bonjour

je rentrerait pas trop dans les détailles car j'ai du faire beaucoup de modif en gros la sa marche.

<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<script>

var nDots = 7;
var Xpos = 100;
var Ypos =100;
var DELTAT = .01;
var SEGLEN = 10;
var SPRINGK = 10;
var MASS = 0.8;
var GRAVITY = 100;
var RESISTANCE = 10;
var STOPVEL = 0.1;
var STOPACC = 0.1;
var DOTSIZE = 50;
var BOUNCE = 0.75;
var followmouse = true;
var dots = [];
var tb_el = [];

function dot(i) {

this.X = Xpos;
this.Y = Ypos;
this.dx = 0;
this.dy = 0;
}

function elasinit() {

for (var i = 0; i < nDots; i++) {
var el=document.createElement('div');
el.style.height=2+'px';
el.style.width=2+'px';
el.style.position= 'absolute';

if (i == 0){
el.style.visibility='hidden';
}

var gema= document.createElement('img');
gema.src="images/oeuf1.gif";

if (i < nDots-1){
gema.height=24;
gema.width=27;
}
else{
gema.height=41;
gema.width=50;
}

el.appendChild(gema);
var done = document.body.appendChild(el);
tb_el.push(done);
dots[i] = new dot(i);
}
setInterval(animate, 20);

}

function MoveHandlerIE(event) {

var sy=document.body.scrollTop || document.documentElement.scrollTop;
var sx=document.body.scrollLeft || document.documentElement.scrollLeft;
Xpos = event.clientX + sx;
Ypos = event.clientY + sy;
}

typeof window.addEventListener == 'undefined' ? document.attachEvent("onmousemove",MoveHandlerIE) : addEventListener("mousemove",MoveHandlerIE, false);


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 (var 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;

var sx=document.body.scrollTop || document.documentElement.scrollTop;
var sy=document.body.scrollLeft || document.documentElement.scrollLeft;

height = document.body.clientHeight + sx;
width = document.body.clientWidth + sy;

if (dots[i].Y >= height - DOTSIZE - 1) {
if (dots[i].dy > 0) {
dots[i].dy = BOUNCE * -dots[i].dy;
}
dots[i].Y = height - DOTSIZE - 1;
}
if (dots[i].X >= width - DOTSIZE) {
if (dots[i].dx > 0) {
dots[i].dx = BOUNCE * -dots[i].dx;
}
dots[i].X = width - DOTSIZE - 1;
}
if (dots[i].X < 0) {
if (dots[i].dx < 0) {
dots[i].dx = BOUNCE * -dots[i].dx;
}
dots[i].X = 0;
}
tb_el[i].style.left = dots[i].X+'px';
tb_el[i].style.top = dots[i].Y+'px';
}
}

typeof window.addEventListener == 'undefined' ? attachEvent("onload",elasinit) : addEventListener("load",elasinit, false);

</script>
</head>
<body>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</body>
</html>

et c'est reparti pour dix ans au moins

cours Forest cours !

Messages postés
7
Date d'inscription
mardi 28 septembre 2004
Statut
Membre
Dernière intervention
20 janvier 2014

bonjour,

je te remercie pour le code, je vais le mettre sur mon site et je vais voir si c'est bon, je te dirais cela
merci encore de ton aide
cordialement
bonjour,

merci le script marche "nickel" je l'ai mis juste pour faire un test, voici mon site : www.paea-musculation.org.pf

le curseur élastique n'est pas en permanence sur le site
très cordialement
Messages postés
1787
Date d'inscription
vendredi 9 mai 2008
Statut
Non membre
Dernière intervention
9 juin 2021
131
en direct de tahiti