Div向下滚动时淡出的阴影

Question

我正在寻找一种让我的主内容div具有在您向下滚动页面时消失的阴影的方法。最好的例子是在http://www.gamespot.com/，注意他们的主要内容有一个阴影，使其流行，但然后慢慢消失，使网站看起来平坦。这种效果如何实现？谢谢！

截图：

Answer 1

一种解决方案，如在评论上述简要地，是使用梯度下拉阴影所证明这里：

http://jsfiddle.net/3eDpM/

另一种解决方案（更静态的）是在背景中使用一个小图像，例如，在Photoshop中产生一个2像素×40像素的渐变。然后，让该图像在所需div的背景中水平重复，同时将其定位在左上角。如：

width: 2px; 
height: 40px; 
background-position: left top; 
background-image: url('../img/gradient.png'); 
background-repeat: repeat-x;