1. ホーム
  2. 質問と答え
  3. この「スクロールして複数の背景画像を変更する」効果をどのように達成していますか？

この「スクロールして複数の背景画像を変更する」効果をどのように達成していますか？

2011-02-09 4 views
1

私はこのHTML5ウェブサイトhttp://www.danhigbie.comを見ていて、「背景画像のスクロール」が魅力的であることがわかりました。私はそのJavascriptを見渡したが、背景イメージを変更するコードは見つからなかった。この「スクロールして複数の背景画像を変更する」効果をどのように達成していますか？

出典

2011-02-09 p0larBoy

+1

ここでは、別の（より良い、私は思う）の例です。 http://www.nikebetterworld.com/index –

+0

優れたサイトphoffer ...私はその背景イメージの効果を行う方法を知っておく必要があります..冷たくて見える – p0larBoy

答えて

1

ウェブページをディスクに保存して、ファイルbetter.jsとbetter.csで再生してください。背景のスクロールは、better.cssで定義されているCSSクラスを変更してbetter.jsファイル内で行われています

出典

2011-02-09 05:31:59 Zabba

+0

私はまだそれを得ることはありません。 better.jsから、特定のスクロール高さに達すると、 'better'クラスと 'scrolled'クラスだけが追加されます。他のクラスはバックグラウンド変更に影響しません。最初のbg（茶色の壁）は、下から2番目のbg（青空）にどのように遷移しますか？ – p0larBoy

1

私はスクロール位置に基づいてmultiplebgsの背景の位置を変更するには、いくつかのjQueryを使用しています：その効果の仕事はどのように説明して優れた記事を見つけました。各背景画像要素は、上から一定の割合で配置されています。これは、セクションごとに非常に多くの背景画像があるため、これは少し難しいかもしれません。私は各背景要素の垂直位置の値を取って、現在のスクロールバーの位置に基づいてそれを変更します。お役に立てれば。ここで

出典

2011-02-15 13:48:18

+0

うわー、彼自身！ちなみに素晴らしいウェブサイト〜！ – p0larBoy

関連する問題

 関連する問題