jquery - ここで見られる視差画像ヘッダーを jsfiddle してみてください: http://soworldwide.org/

Question

http://soworldwide.org/の Web サイトで見られるイメージヘッダーの視差効果を jsfiddle しようとしています。今、スクロールを開始するときに大きな見出しをフェードアウトしたいと思います。しかし、ヘッドラインが激しく消えて、スムーズにフェードバックするだけです...消えるときにもフェードするにはどうすればよいですか?

http://jsfiddle.net/NQHmw/3/

---

$(window).scroll(function(){

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

Answer 1

これは 2 年前の質問のようですが、stop() 関数がテキストのフェードイン/フェードアウト効果をブロックしていました。ここで確認してください：

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

http://jsfiddle.net/NQHmw/60/