Logo GNT
Actualités Tests & Guides Bons Plans
Twitter iPhone pliant OnePlus 11 PS5 Disney+ Orange Livebox Windows 11
Entraide Développement Développement Langage JavaScript Animation JS qui plante ???

Animation JS qui plante ???

9 réponses
Avatar
EhJoe
Bonjour,

Je n'arrive pas =E0 faire marcher une animation que j'ai vu sur le Net,
juste le principe JS, je changerai les images, j'ai tout mis dans un
r=E9pertoire, ici :

http://mesromans.free.fr/LotoAnime/

Je voudrais faire comme sur ce site, l=E0 :

http://caploto.free.fr

Pouvez-vous me rataper ce script, y doit avoir un truc qui coince ???

Merci de vos lumi=E8res :o)

-----
http://irolog.free.fr
Signaler un problème avec ce contenu

9 réponses

Supprimer
Cette action est irreversible, confirmez la suppression du commentaire ?
Signaler le commentaire

Veuillez sélectionner un problème

Nudité
Violence
Harcèlement
Fraude
Vente illégale
Discours haineux
Terrorisme
Autre
Avatar
Francis Spiesser
EhJoe a utilisé son clavier pour écrire :
Bonjour,




Pouvez-vous me rataper ce script, y doit avoir un truc qui coince ???



Le chemin des images, déjà, n'est pas bon.
Ensuite le script d'origine fonctionne sur IE mais pas sur FF et puis,
ça c'est pas bon :
<!//*********************************************************************>
<!//************** Animation de la Guirlande
**************>
<!//*********************************************************************>
enlever les < et les >

et puis... je ne suis même pas sûr qu'ils en voudraient sur
desirsdavenir.com ;-)

--
______
Francis (enlever .NIPUBNISOUMIS)
"Tout corps plongé dans un liquide en ressort mouillé"
Avatar
SAM
Le 9/28/09 5:53 PM, EhJoe a écrit :
Bonjour,

Je n'arrive pas à faire marcher une animation que j'ai vu sur le Net,
juste le principe JS, je changerai les images, j'ai tout mis dans un
répertoire, ici :

http://mesromans.free.fr/LotoAnime/

Je voudrais faire comme sur ce site, là :

http://caploto.free.fr



Y a une erreur de JS ... je ne vois aucune animation !

Pouvez-vous me rataper ce script, y doit avoir un truc qui coince ???



Ça date du siècle dernier : aucun intérêt.




Copier la suite et coller là où on veut l'horreur.

<p>
<img name="imageAnime" id="imageAnime" src="boule1.gif">
</p>
<script type="text/javascript">
var animate;
function anime(n, gauch) {
n = n>6? 1 : n;
var w = window.innerWidth? window.innerWidth :
document.body.offsetWidth? document.body.offsetWidth :
800;
w = w -20;
gauch = gauch>w? 0 : gauch;
var i = (document.images && document.imageAnime)?
document.imageAnime :
document.getElementById('imageAnime');
is = document.getElementById? i.style : i;
i.src = 'boule'+n+'.gif';
is.marginLeft = gauch+'px';
if(gauch >= (w/6)*n) n++;
gauch = +gauch+2;
animate = setTimeout('anime('+n+','+gauch+')', 10);
}
anime(1,10);
</script>
<p>
<button onclick="clearTimeout(animate)">stopper animation</button>
</p>



--
sm
Avatar
EhJoe
On 28 sep, 19:27, Francis Spiesser
wrote:
EhJoe a utilisé son clavier pour écrire :

> Bonjour,

> Pouvez-vous me rataper ce script, y doit avoir un truc qui coince ???

Le chemin des images, déjà, n'est pas bon.
Ensuite le script d'origine fonctionne sur IE mais pas sur FF et puis,
ça c'est pas bon :
<!//********************************************************************* >
<!//**************  Animation de la Guirlande              
**************>
<!//********************************************************************* >
enlever les < et les >

et puis... je ne suis même pas sûr qu'ils en voudraient sur
desirsdavenir.com ;-)

--
______
Francis (enlever .NIPUBNISOUMIS)
"Tout corps plongé dans un liquide en ressort mouillé"




Merci, mais "Désir d'avenir" c'est un peu léger pour moi, non, au
minimum c'est le centre droit, l'UMP quoi...
Avatar
EhJoe
On 28 sep, 21:37, SAM
wrote:
Le 9/28/09 5:53 PM, EhJoe a écrit :

> Bonjour,

> Je n'arrive pas à faire marcher une animation que j'ai vu sur le Net,
> juste le principe JS, je changerai les images, j'ai tout mis dans un
> répertoire, ici :

>http://mesromans.free.fr/LotoAnime/

> Je voudrais faire comme sur ce site, là :

>http://caploto.free.fr

Y a une erreur de JS ... je ne vois aucune animation !

> Pouvez-vous me rataper ce script, y doit avoir un truc qui coince ???

Ça date du siècle dernier :  aucun intérêt.

Copier la suite et coller là où on veut l'horreur.

<p>
<img name="imageAnime" id="imageAnime" src="boule1.gif">
</p>
<script type="text/javascript">
var animate;
function anime(n, gauch) {
  n = n>6? 1 : n;
  var w = window.innerWidth? window.innerWidth :
          document.body.offsetWidth? document.body.offsetWidth :
          800;
  w = w -20;
  gauch = gauch>w? 0 : gauch;
  var i = (document.images && document.imageAnime)?
          document.imageAnime :
          document.getElementById('imageAnime');
  is = document.getElementById? i.style : i;
  i.src = 'boule'+n+'.gif';
  is.marginLeft = gauch+'px';
  if(gauch >= (w/6)*n) n++;
  gauch = +gauch+2;
  animate = setTimeout('anime('+n+','+gauch+')', 10);}

anime(1,10);
</script>
<p>
<button onclick="clearTimeout(animate)">stopper animation</button>
</p>

--
sm



--------------------------------------------

Salut Sam,

C'est ça que tu appelles un programme ??? Tu sais ce qu'elle fait ta
boule, à par changer de numéro, ben elle défile de gauche à droite,
nul, même le PC n'en voudrait pas ! Moi je le trouve bien le truc à
ressort, sauf qu'il a fusillé mon code de couleur graduelle, celui-
ci :

<body style="filter:progid:DXImageTransform.microsoft.Gradient
(gradientType=1,StartColorStr='#00FF00',EndColorStr='white')">

Y marche plus à cause du script JS (qui lui est d'enfer sur ressorts à
six boules), que voici un peut remis en forme et nettoyé :

--------------------------

<!------------------------------------------------------------------->
<DIV id=dot0 style="VISIBILITY: hidden; WIDTH: 9px; POSITION:
absolute; HEIGHT: 9px">
<IMG height src="boule1.gif" alt="loto boule" width></DIV>
<DIV id=dot1 style="WIDTH: 9px; POSITION: absolute; HEIGHT: 9px">
<IMG height src="boule1.gif" alt="loto boule" width></DIV>
<DIV id=dot2 style="WIDTH: 9px; POSITION: absolute; HEIGHT: 12px">
<IMG height src="boule2.gif" alt="loto boule" width></DIV>
<DIV id=dot3 style="WIDTH: 9px; POSITION: absolute; HEIGHT: 19px">
<IMG height src="boule3.gif" alt="loto boule" width></DIV>
<DIV id=dot4 style="WIDTH: 9px; POSITION: absolute; HEIGHT: 26px">
<IMG height src="boule4.gif" alt="loto boule" width></DIV>
<DIV id=dot5 style="WIDTH: 9px; POSITION: absolute; HEIGHT: 30px">
<IMG height src="boule5.gif" alt="loto boule" width></DIV>
<DIV id=dot6 style="WIDTH: 9px; POSITION: absolute; HEIGHT: 72px">
<IMG height src="boule6.gif" alt="loto boule" width></DIV>
<DIV id=dot7 style="WIDTH: 9px; POSITION: absolute; HEIGHT: 72px"></
DIV>


<script type="text/javascript" language="javascript">
var nImages = 8;
if (document.all&&window.print)
document.body.style.cssText="overflow-x:scroll;";
var Xpos = 0;
var Ypos = 0;
var VITESSE = .01;//.01 à .03
var INTERVALLE = 10; //Origine INTERVALLE = 10
var RESSORT = 10;//1 à 30
var MASSE = 1;//0.5; //1
var GRAVITE = 50;//30; //50
var RESISTANCE = 10;//20; //10
var STOPVELOCITE = 0.1;
var STOPACCELERATION = 0.1;
var MARGE_INF = 18;
var REBOND = 0.75;
var isNetscape = navigator.appName=="Netscape";
var SuivreSouris = true;
var images = new Array();
init();
if (isNetscape)
{
document.captureEvents(Event.MOUSEMOVE);
document.onMouseMove = MoveHandler;
}
else
{
document.onmousemove = MoveHandlerIE;
}


function init()
{
var i = 0;
for (i = 0; i < nImages; i++) { images[i] = new dot(i); }
if (!isNetscape)
{
for (i = 0; i < nImages; i++)
{
images[i].obj.left = images[i].X;
images[i].obj.top = images[i].Y;
}
}
if (isNetscape) { startanimate(); }
else { setTimeout("startanimate()", 2000); }
}


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(images)
{
var startloc = document.all.tags("LI");
var i = 0;
for (i = 0; i < startloc.length && i < (nImages - 1); i++)
{
images[i+1].X = startloc[i].offsetLeft;
startloc[i].offsetParent.offsetLeft - MARGE_INF;
images[i+1].Y = startloc[i].offsetTop +
startloc[i].offsetParent.offsetTop + 2*MARGE_INF;
}
images[0].X = images[1].X;
images[0].Y = images[1].Y - INTERVALLE;
}


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;
}


function vec(X, Y)
{
this.X = X;
this.Y = Y;
}


function springForce(i, j, spring)
{
var dx = (images[i].X - images[j].X);
var dy = (images[i].Y - images[j].Y);
var len = Math.sqrt(dx*dx + dy*dy);
if (len > INTERVALLE)
{
var springF = RESSORT * (len - INTERVALLE);
spring.X += (dx / len) * springF;
spring.Y += (dy / len) * springF;
}
}


function animate() {
var start = 0;
if (SuivreSouris)
{
images[0].X = Xpos;
images[0].Y = Ypos;
start = 1;
}
for (i = start ; i < nImages; i++ )
{
var spring = new vec(0, 0);
if (i > 0) { springForce(i-1, i, spring); }
if (i < (nImages - 1)) { springForce(i+1, i, spring); }
var resist = new vec(-images[i].dx * RESISTANCE,-images[i].dy *
RESISTANCE);
var accel = new vec((spring.X + resist.X)/ MASSE,(spring.Y +
resist.Y)/ MASSE + GRAVITE);
images[i].dx += (VITESSE * accel.X);
images[i].dy += (VITESSE * accel.Y);
if (Math.abs(images[i].dx) < STOPVELOCITE &&
Math.abs(images[i].dy) < STOPVELOCITE &&
Math.abs(accel.X) < STOPACCELERATION &&
Math.abs(accel.Y) < STOPACCELERATION)
{
images[i].dx = 0;
images[i].dy = 0;
}
images[i].X += images[i].dx;
images[i].Y += images[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 (images[i].Y >= height - MARGE_INF - 1)
{
if (images[i].dy > 0) { images[i].dy = REBOND * -images[i].dy; }
images[i].Y = height - MARGE_INF - 1;
}
if (images[i].X >= width - MARGE_INF)
{
if (images[i].dx > 0) { images[i].dx = REBOND * -images[i].dx; }
images[i].X = width - MARGE_INF - 1;
}
if (images[i].X < 0)
{
if (images[i].dx < 0) { images[i].dx = REBOND * -images[i].dx; }
images[i].X = 0;
}
images[i].obj.left = images[i].X;
images[i].obj.top = images[i].Y;
}
}
</SCRIPT>
<!------------------------------------------------------------------->


Ben alors, si jamais tu peux laisser ce code là (si tu veux absolument
le modifier, tu peux trouver le moyen de lui accéléer le démarrage
quand il part du coin haut gauche il est un peu lent), pour le reste
c'est parfait s'il n'inhibait pas mon code de dégradé, alors si tu
arrives à me rajouter le dégradé...

Cordialement, au plaisir.

Joe.
.
Avatar
EhJoe
On 28 sep, 21:37, SAM
wrote:
Le 9/28/09 5:53 PM, EhJoe a écrit :

> Bonjour,

> Je n'arrive pas à faire marcher une animation que j'ai vu sur le Net,
> juste le principe JS, je changerai les images, j'ai tout mis dans un
> répertoire, ici :

>http://mesromans.free.fr/LotoAnime/

> Je voudrais faire comme sur ce site, là :

>http://caploto.free.fr

Y a une erreur de JS ... je ne vois aucune animation !

> Pouvez-vous me rataper ce script, y doit avoir un truc qui coince ???

Ça date du siècle dernier :  aucun intérêt.

Copier la suite et coller là où on veut l'horreur.

<p>
<img name="imageAnime" id="imageAnime" src="boule1.gif">
</p>
<script type="text/javascript">
var animate;
function anime(n, gauch) {
  n = n>6? 1 : n;
  var w = window.innerWidth? window.innerWidth :
          document.body.offsetWidth? document.body.offsetWidth :
          800;
  w = w -20;
  gauch = gauch>w? 0 : gauch;
  var i = (document.images && document.imageAnime)?
          document.imageAnime :
          document.getElementById('imageAnime');
  is = document.getElementById? i.style : i;
  i.src = 'boule'+n+'.gif';
  is.marginLeft = gauch+'px';
  if(gauch >= (w/6)*n) n++;
  gauch = +gauch+2;
  animate = setTimeout('anime('+n+','+gauch+')', 10);}

anime(1,10);
</script>
<p>
<button onclick="clearTimeout(animate)">stopper animation</button>
</p>

--
sm



------------------------
Sam, pour la vitesse j'ai trouvé, j'ai mis 1000 / 1000eme au lieu de
2000, reste à me régénérer mon dagradé si tu peux ???

Cordialement.
.
Avatar
SAM
Le 9/28/09 10:06 PM, EhJoe a écrit :
On 28 sep, 21:37, SAM
wrote:

Copier la suite et coller là où on veut l'horreur.






Salut Sam,

C'est ça que tu appelles un programme ??? Tu sais ce qu'elle fait ta
boule, à par changer de numéro, ben elle défile de gauche à droite,



ben ... c'est une anim, hein ?
et au moins elle fonctionne.

nul, même le PC n'en voudrait pas ! Moi je le trouve bien le truc à
ressort, sauf qu'il a fusillé mon code de couleur graduelle, celui-
ci :



sauf que filter je veux pas savoir ce que c'est surtout avec
DXImageTransform

sauf que moi j'ai rien vu ! ! !

sauf que ça fait plein de lignes
sauf que des variables en majuscules ... beurk
sauf que isNescape ... c'est pas une façon de faire

Breffle comme chez moi ça ne fait rien, je ne vois pas comment y remédier.
Je sais juste qu'il y une erreur à l'avant dernière ligne.

--
sm
Avatar
SAM
Le 9/28/09 10:20 PM, EhJoe a écrit :
------------------------
Sam, pour la vitesse j'ai trouvé, j'ai mis 1000 / 1000eme au lieu de
2000,



Bon, ça fait au moins un heureux ;-)
(2 avec moi qui ne sera pas distrait par les boing boing)


reste à me régénérer mon dagradé si tu peux ???



Non ça je peux pas, c'est du truc à la IE dont auquel je n'imagine pas
ce que ça fait.
(IE exclusivement, ça ne m'intéresse pas)

--
sm
Avatar
EhJoe
On 29 sep, 00:03, SAM
wrote:
Le 9/28/09 10:20 PM, EhJoe a écrit :

> ------------------------
> Sam, pour la vitesse j'ai trouvé, j'ai mis 1000 / 1000eme au lieu de
> 2000,

Bon, ça fait au moins un heureux ;-)
(2 avec moi qui ne sera pas distrait par les boing boing)

> reste à me régénérer mon dagradé si tu peux ???

Non ça je peux pas, c'est du truc à la IE dont auquel je n'imagine pa s
ce que ça fait.
(IE exclusivement, ça ne m'intéresse pas)

--
sm



---------------------

Sam,

Ouais, je viens d'essayer sur Mozilla, marche pas, mais libre à toi de
le faire marcher (à l'identique) sur les deux, en faisant changer le
numéro dans les boules et en restituant un dégradé, hé hé...

Cordialement.

Joe.
.
Avatar
Francis Spiesser
Le 28/09/2009, EhJoe a supposé :
Merci, mais "Désir d'avenir" c'est un peu léger pour moi, non, au
minimum c'est le centre droit, l'UMP quoi...



Forget it...

--
______
Francis (enlever .NIPUBNISOUMIS)
"Tout corps plongé dans un liquide en ressort mouillé"