Forums Développement Multimédia

Aller au contenu

- - - - -

Script js lu qu'une fois help

aide js

1 réponse à ce sujet

#1 gozbe

    Ceinture Blanche

  • Members
  • Pip
  • 1 messages

Posté 11 May 2019 - 09:05 AM

Bonjour,

Je suis novice dans le domaine, et j'essaye de creer un slider avec des images avec un bouton forward/back/play/pause.

Jusque la rien ne s'est mis en travers de ma route sauf; lorsque j'essaye d'executé mon play/pause,
cela ne se produit qu'une seul fois... Quelqu'un pourrait m'éguiller ?

Je vous mets mon code en dessous:
( le tableau avec image et legend a bien été créé au dessus )


function onForward()
{

var img = document.querySelector("img")
var legend = document.querySelector("figcaption")

if(currentImage == slides.length - 1)
{
currentImage = 0;
}
else
{
currentImage = currentImage+1;
}

img.src = slides[currentImage].image; // je modifie la balise de l'image
legend.textContent = slides[currentImage].legend; // je modifie la texte à l'interieur de la balise
}


function onPlay()
{
var button = document.querySelector("#play i")

if(interval == null)
{
interval = setInterval(onForward,2000);
button.classList.add('fa-pause');
button.classList.remove('fa-play');
}
else
{
clearInterval(interval);
interval == null;
button.classList.remove('fa-pause');
button.classList.add('fa-play');

}


function onBack()
{
var img = document.querySelector("img")
var legend = document.querySelector("figcaption")

if(currentImage == 0)
{
currentImage = slides.length - 1;
}
else
{
currentImage = currentImage - 1;
}

img.src = slides[currentImage].image;
legend.textContent = slides[currentImage].legend;
}



}


var hidden = document.querySelector('a');
hidden.addEventListener("click", onClick );

var forward = document.querySelector('#forward')
forward.addEventListener('click', onForward)

var back = document.querySelector('#back')
back.addEventListener('click', onBack)

var play = document.querySelector("#play")
play.addEventListener("click", onPlay)
}


#2 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 7012 messages

Posté 25 May 2019 - 19:40 PM

Bonjour,

Poste un exemple en ZIP en pièce jointe avec une page HTML simplifiée, ton JS et quelques images, pour qu'on puisse tester et essayer de t'aider.

Dans le code que tu donne il y a des erreurs, le voici une fois nettoyé :


function onForward() {

        var img = document.querySelector("img")
        var legend = document.querySelector("figcaption")

        if (currentImage == slides.length - 1) {
                currentImage = 0;
        } else {
                currentImage = currentImage + 1;
        }

        img.src = slides[currentImage].image; // je modifie la balise de l'image
        legend.textContent = slides[currentImage].legend; // je modifie la texte à l'interieur de la balise
}


function onPlay() {
        var button = document.querySelector("#play i")

        if (interval == null) {
                interval = setInterval(onForward, 2000);
                button.classList.add('fa-pause');
                button.classList.remove('fa-play');
        } else {
                clearInterval(interval);
                interval == null;
                button.classList.remove('fa-pause');
                button.classList.add('fa-play');

        }


        function onBack() {
                var img = document.querySelector("img")
                var legend = document.querySelector("figcaption")

                if (currentImage == 0) {
                        currentImage = slides.length - 1;
                } else {
                        currentImage = currentImage - 1;
                }

                img.src = slides[currentImage].image;
                legend.textContent = slides[currentImage].legend;
        }



}


var hidden = document.querySelector('a');
hidden.addEventListener("click", onClick);

var forward = document.querySelector('#forward')
forward.addEventListener('click', onForward)

var back = document.querySelector('#back')
back.addEventListener('click', onBack)

var play = document.querySelector("#play")
play.addEventListener("click", onPlay)
}

Il y a des problèmes de fermetures de blocs (accolades) et tu te retrouve avec la fonction "onBack" à l'intérieur de la fonction "onPlay".




Répondre à ce sujet



  

1 utilisateur(s) li(sen)t ce sujet

0 membre(s), 1 invité(s), 0 utilisateur(s) anonyme(s)

authorised training centre

Centre de Formation Mediabox - Adobe et Apple Authorised Training Center.

Déclaré auprès de la Direction du Travail et de la Formation Professionnelle

Mediabox : SARL au capital de 62.000€ - Numéro d'activité : 11 75 44555 75 - SIRET : 49371646800035

MEDIABOX, 23, rue de Bruxelles, 75009 PARIS

FFP