在
http://us.starcraft2.com/转到星际争霸II网站并向下滚动到页面底部.注意看起来你是怎么看出驾驶舱的.
当您向上和向下滚动时,星星会独立于驾驶舱窗口移动,从而产生分层效果.
他们如何让两张图像彼此独立移动？
编辑：感谢下面的回复.我确实注意到他们使用的是透明的.png图像,但我对他们如何获得“滑动”效果感兴趣,当你向下滚动时行星会进入视野.
昨晚我没有使用我的开发环境来完成它,但我现在想出来了.
它是通过一对嵌套的div标签实现的.父项的背景是“固定的”,子项1的背景设置为“滚动”.相关的CSS如下：
<style type="text/css">
.parent
{
background: url("/Images/Fixed Image.png") no-repeat fixed 50% 100% transparent;
position: relative;
height: 800px;
}
.parent div
{
background: url("/Images/Scrolling Image.png") no-repeat scroll 50% 190px transparent;
height: 100%;
}
</style>
和HTML：
<div class="parent" >
<div>
</div>
</div>
