0

私はJQUERYに比較的慣れていないので、正しい方向のポイントを探しています。

フェードオンスクロール効果を実現するにはどうすればよいですか？

http://fearthegrizzly.com/またはhttp://davegamache.comのように

理想的には、フェードアウトしたい画像をdivにドロップするオプションが必要です。それが可能であれば。

これをCargoCollectiveに実装したいのはおそらく言及する価値があります。

ありがとう

4

2 に答える 2

17

fearthegrizzly.comは.css（）メソッドを使用します。あなたは試すことができます：

$(window).scroll(function() {
    $(".header-image").css({
    'opacity' : 1-(($(this).scrollTop())/250)
    });          
});

250ピクセル下にスクロールすると、プロパティが完全にフェードアウトし、その逆も同様です。

于 2014-06-28T17:29:24.103 に答える
1

質問するためのヒント：欲しいものだけを教えてはいけません。私たちはあなたのためにあなたの仕事をするためにここにいるのではありません。私たちがそれを修正するのを手伝うことができるようにあなたが試したことを私たちに見せてください。

そうは言っても、これは始まりです...

ウィンドウのスクロールトップの位置が20pxを超えると、divがフェードアウトし、上にスクロールすると、フェードインに戻ります。

$(window).scroll(function(){
   if($(window).scrollTop()<20){
         $('.fader').stop(true,true).fadeIn("slow");
   } else {
         $('.fader').stop(true,true).fadeOut("slow");
   }
});

デモ

于 2012-07-13T01:21:57.487 に答える