跳轉部分開始之前scrolltop動畫

Question

我正在嘗試使用skrollr和jquery創建sidescrolling選擇你自己的冒險類型的東西。藉助我在JavaScript中的微觀技能（試圖改進它），除了一件事之外，我設法解決了一些問題。

我將動畫設置爲動畫，以使各部分能夠播放，但是我希望能夠在播放之前跳轉部分。由於skrollr「連續播放」了所有內容，因此scolltop自然希望「播放」你和「目標」之間的所有內容。我想知道如何告訴scrolltop檢查它的位置，將它與目標進行比較，以及如果部分在兩者之間以在它開始滾動動畫之前跳過它們。

我想這主要是一個jQuery的問題。要使用簡單的jQuery就像給你一個想法，IM：

$('#chapter4a').on('click', function() { 
     $('html, body').animate({ scrollTop: 2750 }, 5000); 

     }); 

什麼，如果我在0，希望它在500ms的動畫到200，然後跳到2000和動畫，以2700比另一個1000毫秒。那邏輯是什麼樣的？

在此先感謝。

Answer 1

jQuery允許您在動畫中擁有different easing。也許值得看看它，它可能有你需要的，然後你不需要太多的代碼。

不過，要回答你的問題，這應該工作：

$('#chapter4a').on('click', function() { 
     $('html, body').animate({ scrollTop: 200}, 500,function() { 
      $('#chapter4a').scrollTop(2000); 
      $('html, body').animate({ scrollTop: 2700}, 1000); 
     }); 
});