2017-01-20 8 views
2

スクロールマジックの例に続いて視差スクロールを実装しようとしています。scrollmagic/greensock。スクロールが行われていなくても初期位置に影響する

greensockのドキュメントでは、TimelineMax.toのようなものが、そのシーン内の要素の最終位置を定義しています(.fromとは対照的に、初期を定義しています)。

しかし、特に、ページが読み込まれるときに要素がビューポートの上部にある場合、.toが実際に最初の位置にすぐに影響することがわかります。例えば、このために

.to($('.intro-header .bcg'), 3, {y: "80%",rotation:0.01, ease:Linear.easeNone}); 

は、ページがロードされるよう、40%の位置ですでに私の要素.intro-header .bcgを置かないと、撮影した場所として何のスクロールう!

私は数日間私の脳を傷つけてきましたが、なぜこれが起こるのかを知ることはできません。

シーンのデュレーションを1200%のようなものに設定した場合のみ、要素がページの読み込み時に正しい初期位置に表示されますが、シーンは非常にゆっくりと発生します。

答えて

0

問題はシーンの継続時間ではなく、triggerHookパラメータであることがわかりました。

私は値だけonEnteronCenteronLeave、または00.5可能性という誤った印象の下にあったそこに多くの情報が、このシーンパラメータon Scroll Magicではありませんが、私のtriggerHookonEnterとした...

論理的にはその間の任意の数にすることができます。

0.1に設定すると、そのトリックが実行されました。ユーザーがスクロールを開始するまでシーンが開始されないため、すべての要素がページのロード時に正しい位置に表示されます。

これはscrollmagicの例ではあまり明確ではないので、私の答えが他の人に役立つことを願っています。

関連する問題