Cacher une flèche d'un slideshow

Question

Bonjour, J'aimerais savoir si il est possible de cacher la flèche next ou previous lorsque je suis à la fin du slideshow (next à cacher) ou au début (previous à cacher). Si oui comment ? ex: 3 slides dans le slideshow cas 1: slide 1 > cas 2: < slide 2 > cas 3: < slide 3 slideshow : http://www.slidesjs.com/ Merci.

BBFUNK01 · Answer

Hello,

ton slideshow tourne en boucle donc si tu veux masquer les flèches en fonction de l'image en cours affichée (image de fin, de début, ou au milieu) il te faudra proposer une autre manière de revenir au début du slideshow (si tu es à la fin). Sinon à priori (j'ai jeté un œil des plus furtifs) le slideshow doit être en JQuery donc :


// pour masquer la flèche de droit quand tu es la fin :
$("#id_fleche_de_droite").hide();
// pour l'afficher :
$("#id_fleche_de_droite").show();


A+

BBFUNK01

//C'est en forgeant qu'on devient forgeron... ;-) ;

deathcendre · Answer

Ce qui arrive à un autre de mes problèmes. 
Je ne trouve pas où on peut connaitre le slide courant.

Je ne comprend vraiment rien au JS. J'ai commencé seul y a 2 semaines ^^

BBFUNK01 · Answer

Re,

et bien je dirai que c'est donc l'occasion de parfaire tes compétences en la matière :).
Dans le .zip que tu as téléchargé il y a dans le dossier "source" un fichier "jquery.slides.js", c'est la version non-minifiée du plugin et c'est sur celle-ci que tu vas pouvoir modifier le plugin pour parvenir au résultat que tu souhaites.
Il va te falloir modifier la fonction suivante pour masquer / afficher les boutons "précédent" et "suivant" comme tu le souhaites :


// lignes 311 à 332
Plugin.prototype._setuptouch = function() {
      var $element, next, previous, slidesControl;
      $element = $(this.element);
      this.data = $.data(this);
      slidesControl = $(".slidesjs-control", $element);
      next = this.data.current + 1;
      previous = this.data.current - 1;
      if (previous < 0) {
        previous = this.data.total - 1;
      }
      if (next > this.data.total - 1) {
        next = 0;
      }
      slidesControl.children(":eq(" + next + ")").css({
        display: "block",
        left: this.options.width
      });
      return slidesControl.children(":eq(" + previous + ")").css({
        display: "block",
        left: -this.options.width
      });
    };


Ensuite tu charges le fichier modifié au lieu de charger le fichier par défaut du plugin et ça devrait rouler ;-).

A+

BBFUNK01

//C'est en forgeant qu'on devient forgeron... ;-) ;

deathcendre · Answer

re,

Parfait ! J'ai réussi. Merci à toi.

    Plugin.prototype._setuptouch = function() {
      var $element, next, previous, slidesControl;
      $element = $(this.element);
      this.data = $.data(this);
      slidesControl = $(".slidesjs-control", $element);
      next = this.data.current + 1;
      previous = this.data.current - 1;
      if (previous < 0) {
        previous = this.data.total - 1;
$("#slides .slidesjs-previous").hide();
      }
  else
  {
$("#slides .slidesjs-previous").show();
  }
      if (next > this.data.total - 1) {
        next = 0;
$("#slides .slidesjs-next").hide();
      }
  else
  {
$("#slides .slidesjs-next").show();
  }
      slidesControl.children(":eq(" + next + ")").css({
        display: "block",
        left: this.options.width
      });
      return slidesControl.children(":eq(" + previous + ")").css({
        display: "block",
        left: -this.options.width
      });
    };

BBFUNK01 · Answer

De rien .

Tu vois c'était pas si compliqué :).

A+

BBFUNK01

//C'est en forgeant qu'on devient forgeron... ;-) ;

deathcendre · Answer

J'ai parlé trop vite...

ta solution semble être compatible uniquement sous chrome. 

J'ai tester opéra et firefox aussi et dans ces 2 derniers, les flèches ne sont pas cachées.

BBFUNK01 · Answer

Vide simplement le cache des navigateurs sous lesquels ça ne marche pas et recharge la page (quitte et relance les navigateurs pour être sûr), ça devrait le faire .

BBFUNK01

//C'est en forgeant qu'on devient forgeron... ;-) ;

Cacher une flèche d'un slideshow

7 réponses

Votre réponse

Discussions similaires