11548 sujets

JavaScript, DOM et API Web HTML5

salut à tous Smiley smile

je bosse sur un diaporama manuel en javascript et je n'arrive à créé des fonction lecture et arret pour un mode automatique.

j'ai bien trouver ceci mais lorsque j'essaye de le repeter en boucle, çà marche pas et çà plante mes fonctions manuelles Smiley bawling

pour avoir 5 seconde puis defilement de l'image il faut faire ceci:

function lecture()
{
setTimeout("changeimage(+1)",delai);
}


mais pour ma boucle de la fonction lecture(), c'est pas gagner Smiley decu

voila ce que j'ai tenté de faire (une boucle du code si-dessus qui se repete du nombre d'image + 1 pour revenir sur l'image de départ à la fin)

<!--

//Vous pouvez modifier les parametres du script ici
//Les images doivent se nommer:
//prefiximage[valeur entre 1 et nbimages].extension
//prefixthumb[valeur entre 1 et nbimages].extension
//Prefix des vignettes(peut contenir un r&eacute;pertoire)
var prefixthumb='./img/piece'
//Prefix des images(peut contenir un r&eacute;pertoire)
var prefiximage='./img/piece'
//Extension des images
var extension='jpg'
//Nombres d'images
var nbimages=8
//Delai entre chaque image en ms
var delai=5000
//==========================
var newi=0, lasti=0
//Si pas=1 : image suivante
//Si pas=-1: image precedente
function changeimage(pas)
{

    {
        //Ajout du pas
        newi=newi+pas
        
        //Si on arrive au d&eacute;but, on repart de la fin
        if(newi<1) newi=nbimages
        
        //Si on arrive a la fin, on repart du d&eacute;but
        if(newi>nbimages) newi=1
    }
    if(newi==lasti) changeimage(0)
    else
    {
        lasti=newi
        if(document.getElementById) o=document.getElementById('diapo');
        else if(document.images) o=document.images.diapo;
        
        if(o)
        {
            if(o.filters) o.filters[0].apply();
            o.src=prefixthumb+newi+'.'+extension
            if(o.filters) document.getElementById('diapo').filters[0].play();
        }
    }
}
changeimage(0)

function lecture()
var compteur=0;
{
    while(compteur=nbimages)
    {
      compteur++
      }
      if(compteur<nbimages)
      setTimeout("changeimage(+1)",delai);
      else
      changeimage(0);
}

//-->


voila ça marche pô Smiley sweatdrop

il faut bien sur que cette fonction lecture() ne plante pas la fonction changeimage() et qu'elle puisse etre stoppé par une autre fonction arret()

c'est moi qui est ajouter la variable compteur et le script est correct jusqu'à la fonction lecture()

si quelqu'un a une idée pour faire ces boucles lecture() et arret() Smiley cligne
Modifié par beroots (28 Nov 2005 - 00:43)
Bonjour,
Cette instruction inscrite dans le timeout ne te choque pas ?

changeimage(+1)

Ce +1, c'est ... hmmm... comment dire..... franchement bizarre
y'a du mieux car ça ne plante plus mon mode manuel Smiley cligne

par contre ça marche toujour pas Smiley bawling

j'ai virer le + car c'etait bien une erreur et j'ai même mis la variable delai dans la fonction. j'ai aussi virer les ; après ces variables mais suis pas sur que ça soit bon!

ça donne ceci:
function lecture()
{
//Delai entre chaque image en ms
var delai=5000
var compteur=0
    while(compteur<=nbimages)
    {
      compteur++
      }
      if(compteur<nbimages)
      setTimeout("changeimage(1)",delai);
      else
      changeimage(0);
}


ça marche toujour pas et sous IE ça me met un message d'alert "stack overflow at line: 34" soit au niveau du else de l'autre fonction

j'ai remarquer aussi un petit probleme de la fonction changeimage () qui en manu m'oblige à clické deux fois sur le lien <a href="changeimage (1)"> pour faire defiler la premiere image.
par contre le clic sur <a href="changeimage (-1)> marche au premier click mais saute une image et passe directement à l'avant derniere image

si quelqu'un à une idée Smiley cligne
Ce code, il sert à quoi ?


while(compteur<=nbimages)

{

compteur++

}


Parce que là, tu comptes dans le vide.
Modifié par QuentinC (21 Nov 2005 - 06:57)
c'est pour incrémenter mon compteur, enfin je crois Smiley langue

merci de resté indulgent car c'est ma premiere boucle Smiley sweatdrop

je debute en javascript et le seul point important que j'ai trouver de correct c'est qu'il faut faire une boucle de setTimeout("changeimage(1)",delai);
qui devra etre executer "nbre image + 1" fois pour que la fonction lecture face un tour et revienne sur l'image de depart.

je me suis basé sur different exemple de selfhtml mais je cherche surtout à progressé et comprendre mes erreures Smiley cligne

si quelqu'un peut me venir en aide Smiley smile

merci d'avance Smiley cligne
En fait, tu ne peux pas t'en tirer comme ça, parce qu'avec ton script, tous les timeout sont lancés en même temps ou presque, ce qui fait que, selon les navigateurs, soit il n'y en a qu'un qui est exécuté, ou soit ils sont tous exécutés mais tellement rapidement que tu ne t'aperçois de rien.

En principe, l'utilisation d'un timeout se fait de cette manière :


function run () {
//.. tous les traitement dépendant du timeout que tu veux ...

setTimeout("run();", 10000);
}


Donc pour ton cas, je verrais bien un truc comme :


function lecture (nb) {
changeImage(1);
nb -= 1;
var delai = 10000;
if (nb > 0) setTimeout("lecture("+nb+");", delai);
}


Et tu lances la lecture automatique en passant en paramètre de la fonction lecture le nombre de fois que tu veux voir l'image changer.
J'ai fait le code en live dans le textarea de réponse donc je n'ai aucune garantie sur son fonctionnement.
Tu es victime du syndrome de "ça marche pas", il faut te soigner.
En clair : si tu dis simplement "ça marche pas", personne ne pourra t'aider. Il faut préciser ce qui ne va pas : y a-t-il un message d'erreur ? un comportement insolite ? etc...
nan c'est que en fait rien ne se passe.

aucun message d'erreur non plus.

pourtant je vois où tu veut en venir avec ce code. l'idée est interessante je pense mais changeimage (1) ne s'execute même pas la premiere fois.
bizard Smiley sweatdrop

j'ai remarquer que mon diaporama à un petit défault en manuel car il faut executer deux fois (2clic) changeimage(1) pour qu'il commence et le premier clic sur changeimage (-1) saute une image et affiche l'avant derniere image du diaporama Smiley ohwell

j'ai donc essayer de le faire defiler en manu avant le test de t'a fonction histoire que ce bug ne gene pas pour le test de ta fonction mais rien a faire Smiley decu

il serait peut être bien de resoudre ce bug en manu avant de faire les fonction lecture et arret mais je ne voit pas vraiment d'où vient le probème.

si quelqu'un à une idée... Smiley cligne
Le mieux quand on a un bug de ce type c'est de repprendre la totalité du script.
J'en ai profité pour rajouter des ; où il en manquait, pour virer quelques accolades en trop, et pour faire quelques modifs.


var nbimages = 8;
var delai = 5000;
var prefixthumb='./img/piece';
var extension='jpg';
var newi = 1, lasti = 1, timeout = null;

function changeimage(pas)
{
lasti=newi
newi=((newi+pas)%nbimages)+1;

if(document.getElementById) o=document.getElementById('diapo');
else if(document.images) o=document.images.diapo;
else if (document.all) o = document.all['diapo'];

if (o) {
if(o.filters) o.filters[0].apply();
o.src=prefixthumb+newi+'.'+extension;
if(o.filters) o.filters[0].play();
}}

function lecture (nb) {
changeImage(1);
nb -= 1;
if (nb > 0) timeout = setTimeout("lecture("+nb+");", delai);
}

function arret () {
if (timeout) clearTimeout(timeout);
}
document.onload = window.onload = function () { changeimage(0); };


et le XHTML :


<img src="" alt="Image du diaporama, à toi de mettre un alt pertinent" width="50" height="50" id="diapo" />
<a href="javascript:changeimage(1);">Image suivante</a>
<a href="javascript:changeimage(-1);">Image précédente</a>
<a href="javascript:lecture(nbimages);">Démarrer la lecture automatique</a>
<a href="javascript:arret();">Arrêter la lecture automatique</a>


P.S. Je n'ai pas testé.
bon je vient de tester et c'est pas encore ça.

bon je sait le script que j'utilisais au depard n'est qu'un fragment de script diaporama tres complet. mais la personne qui la distribuer l'a couper en un mode auto et un mode manu. j'avait bien essayer de recoller les deux morceau mais sans succes Smiley decu
le script d'origine doit etre un must du genre car il integre la gestion de vignette, un mode manu et un auto

si tu veut essayer de voir si il est possible de faire plus simple en recollant les deux, regarde ces liens:

le manu

le auto

la similitude entre les deux est frappante

pour ce qui est de ton script, je l'ai tester et il y a plusieur soucis:

- il passe tout seul sur la deuxieme image des l'entrer sur la page (au chargement du script en fait)

-la fonction changeimage (1) ne charge que les images "paires" (il saute une image à chaque fois et vu qu'on part de l'image deux à cause du probleme ci-dessus, on a que les images paires)

-la fonction changeimage (-1) ne fonctionne pas est plante mes gifs animé de ma page ( aucun message d'erreur mais ça plante)

-la fonction lecture ne plante pas mais ne fonctionne pas non plus donc peut pas savoir pour la fonction arret () de ce fait Smiley sweatdrop

je regarde de mon coté si j'arrive à faire quelque chose.

si des fois quelqu'un voit d'où viennent ces problemes Smiley cligne

et encore merci pour ton aide Smiley smile
J'ai voulu faire plus court, mais apparament, ça va pas. Alors essaie de remplacer
newi=((newi+pas)%nbimages)+1;


par :

newi += pas;
if (newi > mbimages) newi -= nbimages;
if (newi <= 0) newi += nbimages;
là il n'y a plut rien qui marche mais toujour aucun message d'erreur Smiley sweatdrop

que pense tu des deux script qui ce resemble?
est ce qu'il s'assemble? Smiley ravi
Ok merci du coup de main mais j'ai trouver une solution alternative qui me convient Smiley smile

en plus je ne veut pas abuser de ton temps libre Smiley cligne

encore merci
je ferme le topic