这是从csszengarden的设计作品Fun with backgrounds orange by anthony forsey中看到的，先来来看看这个非常有创意的效果!
原理根据两幅重叠的图片相对位置的不同组合成一幅完整的图片，滚动条的滚动就是控制这个组合。有点像电子显示牌利用矩阵点显示文字或图片。下面是这两张图片
主背景图片
黑色条纹图片，就是利用它的黑色横向纹理与主背景图片的
随滚动条滚动改变的背景图片_css
重叠，产生背景图片的改变。
Xhtml
<div id=”intro”></div>
<div id=”orderBg”><span></span></div>
<div id=”orderBg”><span></span></div>
body { margin: 0px; padding: 0px; background-image: url(orange_zensmall.gif);background-repeat:no-repeat; background-attachment: fixed; background-color: #FF6600;background-position: 0px 14px;}
#orderBg { background-image: url(1px_grid_blk.gif); height: 2400px; width: 100%;background-attachment: scroll; background-repeat: repeat; top: 0px; position: absolute; z-index: 0; left: 0px;}
欢迎大家阅读《随滚动条滚动改变的背景图片_css》,跪求各位点评,若觉得好的话请收藏本文，by 搞代码
