topScroll動畫阻塞頁面滾動jquery

我已經建立了這個網站，它基本上分成3個div，我在滾動瀏覽它們的時候寫了一些動畫腳本。topScroll動畫阻塞頁面滾動jquery

<div id="home"></div> 
<div id="portfolio"></div> 
<div id="about"></div>

我擁有了整個演示在這裏：https://jsfiddle.net/7cv6zd1L/在那裏你可以很明顯的看出，該動畫的「組合」 DIV我的網頁將不會繼續向下滾動之後。我已經在那裏它不會向上滾動同樣的問題，但我在這裏固定它：

var lastScroll = $(window).scrollTop(); 
$(window).scroll(function() { 
       console.log(lastScroll); 
       var scrollTop = $(window).scrollTop(); 
       var divTop = $("#portfolio").offset().top; 
       if (scrollTop > lastScroll && scrollTop > $('body').height()/3) { 
        $('body').stop().animate({ 
        scrollTop: divTop 
        }, 50); 
       } 
       lastScroll = scrollTop; 
      });

我似乎無法總結我的周圍動畫的邏輯頭，一點點幫助，將不勝感激。

P.S.不要讓失蹤的圖像混淆你我沒有故意包含它們。

編輯：我希望能夠在轉換到下一個div時使用上述相同的代碼。

來源

2017-06-12 Amir Rami

什麼是你想在這裏實現？ – Rafael

@rafael使用腳本在網頁中自由滾動。如果你打開演示，你會發現滾動在某個點被阻止。。 –

的IF用'$（ '主體'）停止（）動畫（{ \t \t \t \t \t \t scrollTop的：divTop \t \t \t \t \t \t}，50）;'引起問題，因爲divTop是' ＃porfolio'抵消。所以身體正在滾動到那個位置。這就是爲什麼你不能向下滾動。你想在那裏實現什麼？ –

如果你只是希望能夠在動畫後向下滾動，然後再更改本：

if (scrollTop > lastScroll && scrollTop > $('body').height()/3)

這樣：

if (scrollTop > lastScroll && scrollTop > $('body').height()/3 && scrollTop < divTop)

來源

2017-06-12 13:06:29 Repo

非常感謝，upvote這個人... –

不客氣=）很高興它的工作。 – Repo

topScroll動畫阻塞頁面滾動jquery

回答

相關問題