이 상자 그림자를 어떻게 효율적으로 만들어야합니까?

Question

내 사이트에 작은 고정 위치 헤더가 있습니다. 그것은 그것의 바닥에 그림자가 있습니다. 모두 좋지만 머리글에 원래 테두리가 있고 (페이지가로드 될 때) 사용자가 아래로 스크롤하면 그림자가 나타나고 테두리가 사라지는 것이 더 좋을 것이라고 생각합니다.

또한 프로세스를 거꾸로 작업하고 싶습니다. 따라서 사용자가 위로 스크롤하면 그림자가 사라지고 테두리가 나타납니다.

어떻게 작성할 수 있습니까? 유용한 리소스에 대한 링크를 보여 주시겠습니까? 아니면 올바른 코드 조각을 보여줄 수 있습니까? 덕분에 ... [코드는 여기에 있습니다 : http://jsfiddle.net/dp8fG/3/]

여기

Answer 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', 
    }); 
});