私は、CSS3トランジションをスクロールイベントにリンクする方法を探しています。私はhttp://nizoapp.com/と同様の機能を探していますが、ページ上の特定のスクロール・ポイントに移動すると特定の要素が動くことになります。私はスクロールイベントをjQuery(オフセットとスクロールを使用)で呼び出さなければならないことは知っていますが、アニメーション部分にCSS3を使用する方法があるのか、jQueryで行う必要があるのか不思議です。いずれにせよ、私はこれを動作させるために飛躍を開始する方法に関するいくつかの助けが大好きです。助けてくれてありがとう。CSS3のアニメーション/トランスフォームをスクロールイベントにリンクする
7
A
答えて
10
良い出発点はthe jQuery Waypoints pluginです。これは、要素にスクロールするたびに関数を実行するのを容易にし、現在表示されているものに基づいてクラスを適用することもできます。その後、それらを使用して、後になっているCSSアニメーションをトリガーすることができます。
更新 - 私はちょうどthe Scrollorama jQueryプラグインに出会ったばかりです。著者は徹底的にテストされていないと述べていますが、それはあなたの後ろのことを正確に行うように設計されており、間違いなく良い出発点のように見えます。
2
特定のCSSをスクロール位置にリンクする方法はありません。あなたはその効果を達成するためにいくつかのJavaScriptの接着剤を含める必要があります。私の好きな方法は、ウィンドウonscroll
のイベントにバインドしてアニメーションコードをそこに置くことです。
2
私はscrollTop()メソッドを使用しています。偉大なプラグインだ
#my-div {
width:200px;
height:200px;
background-color:red;
}
#my-div.animate {
transition: rotate(30deg);
}
関連する問題
- 1. CSS3 Snow Fall Animation内部リンクを無効にする
- 2. javascriptのクロスブラウザの水平スクロールイベントとverticallスクロールイベント
- 3. 別のアプリケーションにスクロールイベントを送信する
- 4. スクロールイベントでディレクティブをテストするには?
- 5. tableheaderviewスクロールイベント
- 6. DataGridViewスクロールイベント
- 7. jQueryスクロールイベント
- 8. RichTextFxスクロールイベント
- 9. スクロールイベントのjquery
- 10. スクロールイベントのアニメーションアニメーション
- 11. C#のスクロールイベント
- 12. JScrollPaneのスクロールイベント
- 13. TinyMCEエディタのスクロールイベントにバインド
- 14. ListViewのスクロールイベントを作成する方法
- 15. WM5のスクロールイベントを処理するCListView
- 16. JQueryのスクロールイベントがトリガーを拒否する
- 17. Android:EditTextのスクロールイベントを検出する
- 18. 1回のCSS3変換後にCSS3を2回変換する
- 19. JavaScript、スクロールイベントの紛失
- 20. jqueryでtouchmoveのスクロールイベント
- 21. スクロールイベントの検出(pdfnet)
- 22. JQueryウィンドウのスクロールイベントですか?
- 23. ExtJSグリッドパネルのスクロールイベントですか?
- 24. css3:リンクがアクティブなときに:before擬似要素を選択する
- 25. iPhoneでスクロールイベント
- 26. オペラはリンクとイメージとcss3の列を認識しません
- 27. iScroll 5、スクロールイベントを検出する方法
- 28. スクロールイベントを還元してリッスンする
- 29. DOMスクロールイベントでIFrameを再接続する
- 30. VB.netのテキストボックスのスクロールバーのスクロールイベント
、リンクへの感謝:
これは私のCSSアニメーションのプロパティHTMLで
を持つクラスを追加または削除します:CSSの
をそれに。 –
問題はありません - 私はそれが本当に多くの異なるもののために役立つので、それにたくさんリンクしていることがわかります。 – CherryFlavourPez
素晴らしいアイデア!私はしばらく前にWaypointを訪れましたが、それを忘れました。それはうまくいくかもしれません。ありがとう! – Andrew