Petite aide en Javascript (afficher, cacher, délais, stop)
11 messages
• Page 1 sur 1
-
guicara - WRInaute passionné
- Messages: 2472
- Inscription: 2 Fév 2006
Petite aide en Javascript (afficher, cacher, délais, stop)
le Dim Mar 01, 2009 17:15
Bonjour,
Tout d'abord je tiens à préciser que je suis une mer***, heu... quiche (!) en Javascript.
Je n'ai jamais voulu m'y intéresser...
Le but :
- Afficher l'image 1 (pendant 10s)
- Cacher l'image 1
- Afficher l'image 2 (pendant 10s)
- Cacher l'image 2)
- Afficher l'image 3
- On ne reboucle PAS
Mon "code" (je sais pas si on peut appeler ça...) :
L'interruption de 10 secondes ne se fait pas.
J'ai regardé du côté de setTimeout, sa ne ma pas plus avancé...
En même temps, on ne peut pas optimiser le script ?
Merci
Tout d'abord je tiens à préciser que je suis une mer***, heu... quiche (!) en Javascript.
Je n'ai jamais voulu m'y intéresser...
Le but :
- Afficher l'image 1 (pendant 10s)
- Cacher l'image 1
- Afficher l'image 2 (pendant 10s)
- Cacher l'image 2)
- Afficher l'image 3
- On ne reboucle PAS
Mon "code" (je sais pas si on peut appeler ça...) :
- Code: Tout sélectionner
function dfucache()
{
document.getElementById('image1').style.display = 'none';
document.getElementById('image2').style.display = 'none';
document.getElementById('image3').style.display = 'none';
}
function dfu()
{
document.getElementById('image1').style.display = 'block'; // On affiche l'image 1
pausecomp(10000);
document.getElementById('image1').style.display = 'none'; // On cache l'image 1
document.getElementById('image2').style.display = 'block'; // On affiche l'image 2
pausecomp(10000);
document.getElementById('image2').style.display = 'none'; // On cache l'image 2
document.getElementById('image3').style.display = 'block'; // On affiche l'image 3
}
function pausecomp()
{
// Trouver sur un site web (c'est sensé faire une pause)
var date = new Date();
var curDate = null;
do { curDate = new Date(); }
while(curDate-date < millis);
}
- Code: Tout sélectionner
<body onload="dfucache()">
...
<div id="image1"><img src="..." alt="" /></div><br />
<div id="image2"><img src="..." alt="" /></div><br />
<div id="image3"><img src="..." alt="" /></div>
...
<input type="button" onclick="dfu()" value="DFU">
L'interruption de 10 secondes ne se fait pas.
J'ai regardé du côté de setTimeout, sa ne ma pas plus avancé...
En même temps, on ne peut pas optimiser le script ?
Merci
-
erestrebian - WRInaute occasionnel
- Messages: 472
- Inscription: 15 Juin 2007
Re: Petite aide en Javascript (afficher, cacher, délais, stop)
le Dim Mar 01, 2009 22:02
Je ferais plutôt une fonction avec un timer qui s'appelle toutes les 10 secondes dont la première instruction est de caché l'image si elle existe et d'afficher la suivante s'il y en a une...
Je pense qu'avec ceux que tu as déjà comme code, tu devrais y arriver sans trop de soucis.
Bon courage!
Je pense qu'avec ceux que tu as déjà comme code, tu devrais y arriver sans trop de soucis.
Bon courage!
-
guicara - WRInaute passionné
- Messages: 2472
- Inscription: 2 Fév 2006
Re: Petite aide en Javascript (afficher, cacher, délais, stop)
le Dim Mar 01, 2009 23:30
Les instructions je les ais ("document.getElementById('image1').style.display ..."); mais mon problème c'est la gestion du timer.
Que dois je utiliser pour le timer ?
Que dois je utiliser pour le timer ?
-
guicara - WRInaute passionné
- Messages: 2472
- Inscription: 2 Fév 2006
Re: Petite aide en Javascript (afficher, cacher, délais, stop)
le Lun Mar 02, 2009 1:50
J'avais déjà cherché de se côté, mais j'avais mal compris le but et le fonctionnement de cette fonction.
Mon script marche bien :
Comment cacher le bouton après qu'on ai cliquer dessus ? style.display = 'none'; mais sur quoi, un Id ?
Mon script marche bien :
- Code: Tout sélectionner
function dfucache()
{
document.getElementById('image1').style.display = 'none';
document.getElementById('image2').style.display = 'none';
document.getElementById('image3').style.display = 'none';
}
function dfu1()
{
document.getElementById('image1').style.display = 'block'; // On affiche IMAGE1
setTimeout('dfu2()',10000); // On lance la fonction dfu2 après 10 secondes
}
function dfu2()
{
document.getElementById('image1').style.display = 'none'; // On cache IMAGE1
document.getElementById('image2').style.display = 'block'; // On affiche IMAGE2
setTimeout('dfu3()',10000);
}
function dfu3()
{
document.getElementById('image2').style.display = 'none'; // On cache IMAGE2
document.getElementById('image3').style.display = 'block'; // On affiche IMAGE3
}
- Code: Tout sélectionner
<body onLoad="dfucache()">
...
<div id="image1">Texte A</div><br />
<div id="image2">Texte B</div><br />
<div id="image3">Texte C</div>
...
<input type="button" onClick="dfu1()" value="Commencer">
Comment cacher le bouton après qu'on ai cliquer dessus ? style.display = 'none'; mais sur quoi, un Id ?
-
guicara - WRInaute passionné
- Messages: 2472
- Inscription: 2 Fév 2006
Re: Petite aide en Javascript (afficher, cacher, délais, stop)
le Lun Mar 02, 2009 12:23
Merci à tout les deux 
En faite le Javascript, c'est pas si nul que ça
J'ai par contre encore un problème, et je ne comprend pas pourquoi.
J'ai rajouté un bouton "Recommencer", qui lance dfu1() après 1,5s, sauf que une fois cliquer, les images ne défiles pas normalement (je vois que la 1er et la dernière, et le timer n'est pas respecté).
Edit : J'ai trouvé, comme un grand ! Il faut utiliser la fonction "clearTimeout" qui tue le timer.
Le timer n'était pas tué, c'est donc pour ça qu'il y avait un conflit.
En faite le Javascript, c'est pas si nul que ça
J'ai par contre encore un problème, et je ne comprend pas pourquoi.
J'ai rajouté un bouton "Recommencer", qui lance dfu1() après 1,5s, sauf que une fois cliquer, les images ne défiles pas normalement (je vois que la 1er et la dernière, et le timer n'est pas respecté).
- Code: Tout sélectionner
function dfucache()
{
document.getElementById('image1').style.display = 'none';
document.getElementById('image2').style.display = 'none';
document.getElementById('image3').style.display = 'none';
document.getElementById('restart').style.display = 'none';
}
function recommencer()
{
dfucache();
setTimeout('dfu1()',1500);
}
- Code: Tout sélectionner
<input type="button" onClick="recommencer()" value="Recommencer" id="restart">
Edit : J'ai trouvé, comme un grand ! Il faut utiliser la fonction "clearTimeout" qui tue le timer.
Le timer n'était pas tué, c'est donc pour ça qu'il y avait un conflit.
- Code: Tout sélectionner
var retardateur;
var retardateur2;
...
function dfu1()
{
document.getElementById('image1').style.display = 'block';
retardateur=setTimeout('dfu2()',10000);
}
function dfu2()
{
document.getElementById('image1').style.display = 'none';
document.getElementById('image2').style.display = 'block';
retardateur2=setTimeout('dfu3()',10000);
}
-
guicara - WRInaute passionné
- Messages: 2472
- Inscription: 2 Fév 2006
Re: Petite aide en Javascript (afficher, cacher, délais, stop)
le Lun Mar 02, 2009 18:38
Bonjour,
Je bloque encore sur un point (cette fois si j'ai inséré un décompteur qui affiche le temps restant avant le passage à l'image suivante) :
Dans dfu1() j'ai initialisé la fonction DemarrerChrono();
Seulement, je n'arrive pas à faire un RESET du compteur pour le passage à dfu2 et dfu3.
J'ai tout essayé mais je ne m'en sort pas...
Modèle concret ici : http://www.itouchfrance.fr/dfu-helper-passage-en-mode-dfu-etape-par-etape
Je bloque encore sur un point (cette fois si j'ai inséré un décompteur qui affiche le temps restant avant le passage à l'image suivante) :
- Code: Tout sélectionner
var secondes = 9;
var timer;
var text = "";
function Chrono()
{
if (secondes > 0)
{
var minutes = Math.floor(secondes/60);
var heures = Math.floor(minutes/60);
secondes -= minutes * 60;
text = secondes;
secondes = secondes + (minutes * 60) - 1;
}
else
{
clearInterval(timer);
text = "";
}
document.getElementById('chrono').innerHTML = text;
}
function DemarrerChrono()
{
timer = setInterval('Chrono()', 1000);
}
Dans dfu1() j'ai initialisé la fonction DemarrerChrono();
Seulement, je n'arrive pas à faire un RESET du compteur pour le passage à dfu2 et dfu3.
J'ai tout essayé mais je ne m'en sort pas...
Modèle concret ici : http://www.itouchfrance.fr/dfu-helper-passage-en-mode-dfu-etape-par-etape
-
erestrebian - WRInaute occasionnel
- Messages: 472
- Inscription: 15 Juin 2007
Re: Petite aide en Javascript (afficher, cacher, délais, stop)
le Mar Mar 03, 2009 15:29
il faut que tu réinitialise la variable secondes dans le else...
je ne comprends pas l'utilité de minutes et heures
je ne comprends pas l'utilité de minutes et heures
-
guicara - WRInaute passionné
- Messages: 2472
- Inscription: 2 Fév 2006
Re: Petite aide en Javascript (afficher, cacher, délais, stop)
le Mar Mar 03, 2009 16:25
La variables heures n'a aucun utilisé, je l'ai viré, par contre minutes, et indépendantes des secondes dans ce cas.
J'ai réinitialiser "seconde" dans else, mais sa ne marche toujours pas
Autre problème, comme tu peux le voir dans le lien donné au dessus, dés que le script est lancé, et qu'on clique sur "Recommencer", le décompteur s'emballe (pourtant, comme tu ma dis, la variable secondes devrait être réinitialisé... étrange :O
J'ai réinitialiser "seconde" dans else, mais sa ne marche toujours pas
- Code: Tout sélectionner
else
{
clearInterval(timer);
secondes = 9;
text = "";
}
Autre problème, comme tu peux le voir dans le lien donné au dessus, dés que le script est lancé, et qu'on clique sur "Recommencer", le décompteur s'emballe (pourtant, comme tu ma dis, la variable secondes devrait être réinitialisé... étrange :O
11 messages
• Page 1 sur 1
Lectures recommandées sur ce thème :
- Afficher / cacher la publicité aux moteurs de recherche
- Afficher / cacher un div au survol d'une image
- cacher javascript
- Javascript : Cacher un élément
- cacher/crypter un code javascript
- 18/07 merci de votre aide, délais bizarre d'indexation
- [PHP] Petite astuce pour afficher simplement du code HTML :D
- Afficher un flux rss via javascript
- Petite aide...
- Petite aide traduction :)
Qui est en ligne
Utilisateurs parcourant ce forum: Aucun utilisateur enregistré et 0 invités
Contact
Confidentialité