0

以下の関数は、ページの 10% に達したときに関数 doSomething を起動しますが、スクロールを続けると、起動し続けます。10% で発射し、その後停止するにはどうすればよいですか?

ではごきげんよう、

ジョーイ

  $(document).scroll(function(e){

      // grab the scroll amount and the window height
      var scrollAmount = $(window).scrollTop();
      var documentHeight = $(document).height();

      // calculate the percentage the user has scrolled down the page
      var scrollPercent = (scrollAmount / documentHeight) * 100;

      if(scrollPercent = 10) {
          // run a function called doSomething
          doSomething();
      }

      function doSomething() { 
            $(".fill").append('<img src="img/arrow-down.png"/>');

          // do something when a user gets 10% of the way down my page
      }

  });
4

1 に答える 1

0

ブラウザによっては、スクロールイベントによってLOTが発生する場合があります。タイマーを使用することをお勧めします。

次のことを試してください。

var  didScroll = false;
var doneAction = false;

$(window).scroll(function() {
    didScroll = true;
});

setInterval(function() {
    if ( didScroll ) {
      didScroll = false;

      // grab the scroll amount and the window height
      var scrollAmount = $(window).scrollTop();
      var documentHeight = $(document).height();

      // calculate the percentage the user has scrolled down the page
      var scrollPercent = (scrollAmount / documentHeight) * 100;

      if(scrollPercent >= 10 && !doneAction) {
          alert('You just scrolled to 10 percent.'); // or whatever action you want to perform
          doneaction = true;
      }
    }
}, 250);

これがお役に立てば幸いです。

于 2012-12-16T01:21:46.790 に答える