このボックスシャドウを効率的に機能させるにはどうすればよいですか？

Question

私は自分のサイトに小さな固定位置のヘッダーを持っています。それはそれの底に影を持っています。 これはいいですが、ヘッダが元々（ページが読み込まれているとき）境界線があり、ユーザがスクロールして影が現れ、境界線が消えてしまうと、見栄えが良くなると思います。

また、私はプロセスを後ろ向きにしたいと思います。したがって、ユーザーが上にスクロールすると、影が消え、境界線が表示されます。

どうすればいいですか？役に立つリソースへのリンクを表示したり、適切なコードを表示できますか？おかげで...

[コードはここにある：http://jsfiddle.net/dp8fG/3/]

Answer 1

ここでは、私は再び影との国境を置き換え、1を作りました。あなたが望むなら、私はそれもアニメーション化することができます。

http://jsfiddle.net/dp8fG/4/

私は.hoverイベントを使用してjQueryのを使用してCSSを変更することによって、これをしませんでした。

$("#header").hover(function(){ 
    //Things to happen on mouseover 
    $(this).css({ 
     'html element':'modifier', 
    }); 
},function(){ 
    //Things to happen on mouseout 
    $(this).css({ 
     'html element':'modifier', 
    }); 
});