別のセクションにスクロールする前に、どのようにアニメートするのですか？

Question

ケースはかなりシンプルです：いくつかのセクションを持つウェブサイトがあります。したがって、各スクロールでは、別のセクションが表示されます。

一部のセクションにはテキストブロックが含まれていて、アニメーション化されている必要があります。

何アニメーションテキストブロックが存在しない場合、それはスクロールダウンの正常な動作を持っている必要があります。

1. 番目のスクロールだけで、次のセクションまでスクロールしなければなりません。

アニメーションテキストブロックがある場合は、スクロールがこの順序である必要があります。

1. 番目のスクロールは、テキストブロックをアニメーション化すべきです。現在のセクションにも残ります

2. ndスクロールして次のセクションにスクロールします。

これを行う簡単な方法はありますか？スクロール

$('#fullpage').fullpage({ 
    onLeave: function(index, nextIndex, direction){ 
     //it won't scroll if the destination is the 3rd section 
     if(nextIndex == 3){ 
      return false; 
     } 
    } 
}); 

をキャンセルするにhttps://github.com/alvarotrigo/fullPage.js#callbacksから

Answer 1

あなたが飛んでテキストが存在するかどうかを決定するパラメータまたはメソッドでonLeaveコールバックを変更してから次のセクションに進み、または飛行テキストがで飛ぶ必要があることができ、次のセクションに行くのをやめてください。

Answer 2

javascriptのアニメーションやアクションを処理する最善の方法である@dieendの名前でコールバックを使用する以外に、アクティブセクションに追加されたactiveクラスなどのfullpage.jsで追加された状態クラスを使用することもできます。 fp-viwing-x-yが追加されました。

この方法では、CSSだけでアニメーションを処理できます。

あなたは国家クラスのアニメーションを作成するために、身体に追加されたクラスを使用する方法についてのon the docs

そして、ここでa video tutorialのリストを持っています。