ScrollRevealを用いて、スクロールされたら、アニメーションが実行されるというものを作っています。
##実現したいこと
要素を1回転させる
##起っていること
今回実装したいアニメーションは回転で、ScrollRevealのコードを書いて動作するところまではできたのですが、回転させたい角度を記述しても、それとはちがう角度のアニメーションが実装されてしまいます。
下記にコードを示します。
Javascript
1ScrollReveal().reveal('.animate', { 2 rotate: { x: 0, y: 0, z: 540}, 3 delay :500, 4 duration: 2000, 5 viewFactor: 0.8, 6 reset: true, 7 distance: 0, 8 opacity: 1, 9 scale: 1, 10 });
上記コードではrotateの部分が540、つまりスクロールで表示されたら540度要素が回転する記述となっています。
しかし、このコードで実装されたものが180度しか回転せず、本来1回転(360°)回転させたいのですが、360度で指定すると、アニメーションが動かず、また、180度で指定すると、540のときと同じような動きをします。
ちなみに720でもアニメーションは動きません。
opacityの問題かと思い、1を指定してみたものの変わらず。。
長文失礼しました。
回答お待ちしております。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/09/19 03:21