页头或顶部的Banner会随着用户鼠标滚动慢慢缩短并且最后消失。非常适合制作用户体验更好的广告宣传Banner。
大家注意，没有使用任何的javascript或者第三方类库，纯CSS实现！
#banner {
height: 500px;
position: fixed;
background: url(banner-bg.jpg);
background-size: cover;/*此属性有高度或宽度100%拉伸的效果,也就是容器多大,背景图片最短的那一边就会拉伸多大*/
width: 100%;
top: 100px;
}
#content {
background: #fff;
width: 100%;
position: relative;
top: 500px;
z-index: 5;
}
