9
votes

Tirer une seule fonction une fois sur défilement (Scrollstop)

Donc, je voudrais déclencher une fonction une seule fois sur défilement (en utilisant Scrollstop , donné par une réponse Stackoverflow)

Le problème est que je ne comprends pas la fonction une seule fois. J'ai essayé différentes solutions (.on (), régler un compteur, le réglant à l'extérieur / à l'intérieur de la fenêtre.scrollstop fonction) mais rien n'a fonctionné.

Je ne pense pas que ce soit difficile, mais ... N'a pas eu pour le faire fonctionner jusqu'à présent.

Voici le plugin que j'utilise xxx

et voici mon code: < Pré> xxx

(retiré le compteur car il n'a pas fonctionné)

Démo en direct ici

PS: la fonction que j'aimerais faire ne se produire qu'une seule fois la pazypaint. Il commence lorsque nous faites défiler jusqu'à l'élément mais cela tire une fois de plus quand il se termine.

javascript jquery jquery-plugins

2 commentaires

alors votre fonction donothing () fait effectivement quelque chose?

@ @Roastted Yep, nom de la fonction idiote, je sais: x

4 Réponses :

7
votes

Que diriez-vous d'utiliser une variable pour voir s'il était précédemment tiré:

var fired = 0;
$.fn.scrollStopped = function(callback) {           
          $(this).scroll(function(){
              if(fired == 0){
                var self = this, $this = $(self);
                if ($this.data('scrollTimeout')) {
                  clearTimeout($this.data('scrollTimeout'));
                }
                $this.data('scrollTimeout', setTimeout(callback,300,self));
                fired = 1;
              }
          });
      };

0 commentaires

7
votes

Voici ma version d'un incendie de fonction une fois lors de l'écoute de l'événement de défilement:

var fired = false;
window.addEventListener("scroll", function(){
  if (document.body.scrollTop >= 1000 && fired === false) {
    alert('This will happen only once');
    fired = true;
  }
}, true)

0 commentaires

0
votes

Que diriez-vous de cette solution?

function scrollEvent() {
  var hT = $('#scroll-to').offset().top,
    hH = $('#scroll-to').outerHeight(),
    wH = $(window).height(),
    wS = $(this).scrollTop();
  if (wS > (hT+hH-wH)){
    console.log('H1 on the view!');
    window.removeEventListener("scroll", scrollEvent);
  }
}
window.addEventListener("scroll", scrollEvent);

1 commentaires

Tandis que cet extrait de code peut être la solution, y compris un L'explication aide vraiment à améliorer la qualité de votre message. N'oubliez pas que vous répondez à la question des lecteurs à l'avenir, et ces personnes pourraient ne pas connaître les raisons de votre suggestion de code.

2
votes

Ces anwsers n'ont pas fonctionné pour moi, alors voici mon code: xxx

0 commentaires