jquery - ページスクロール時のメニューアニメーション - CssまたはJquery?

Question

ページのスクロール時に発生するメニュー アニメーションを css だけで実行できるのか、それとも jquery\other が必要なのかがわかりません。

明確にするためのいくつかの例：

1. http://www.optimo-it.com/products/uCast/
2. http://demo.teothemes.com/?theme=scrn
3. http://demo.brankic.net/?theme=BigBangWP

また、このテーマに関するチュートリアルを誰かが知っている場合は、私の個人的な Web サイトに同様のアニメーションを実装したいと思っているので、それは大歓迎です。

前もって感謝します！

Answer 1

スクロールに反応する場合、つまり、ページ内のスクロールする場所に応じて変化する場合は、scoll イベントをキャプチャして JavaScript で実行する必要があります。jQuery を使用すると、次のようになります。

$(window).scroll(function(){
  ...
  if ($(this).scrollTop() > threshold) {
    // Do stuff
  }
});

ただし、 css を使用してメニューを固定位置に保つことができますposition:fixed。このアプローチでは、適切なアニメーションは得られません。メニューが画面に固定されたままになるだけです。