<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Test | This is only a test page.</title>
<style type="text/css">
body {
background:#fff url(bg_site.png);
margin:0;
}
#juice, #juice .inner, #bottle, #bottle .footer, #bottle .content, #bottle .header, #mid .inner {
margin:0 auto;
}
#monitor {
position:fixed;
top:10px;
left:10px;
color:#f0f0f0;
z-index:999;
}
#juice {
width:99%;
position:fixed;
top:2000px;
}
#juice .inner {
width:1165px;
background:url(juice.png) repeat-x;
height:2000px;
}
#bottle {
width:99%;
text-align:center;
position:absolute;
top:0;
}
#bottle .header {
background:url(bottle_top.png) no-repeat;
width:1175px;
height:2648px;
}
#bottle .content {
background:url(content_bg.png) repeat-y;
height:500px;
width:1186px;
}
#bottle .footer {
background:url(bg_footer.png) no-repeat;
width:1184px;
height:567px;
}
#mid {
width:99%;
position:fixed;
z-index:-999;
}
#mid .inner {
width:92px;
height:2000px;
background:url(strohalm_mid.png) repeat-y;
}
</style>
<script type='text/javascript' src='jquery-1.6.2.min.js'></script>
<script type="text/javascript">
jQuery(document).ready(function($){
$(window).scroll(function() {
$("#monitor").html("scrollTop: "+$(window).scrollTop());
if ($(window).scrollTop()<1108) $("#juice").css('top',490+815-$(window).scrollTop());
else $("#juice").css('top',$(window).scrollTop()/2900*580)
});
})
</script>
</head>
<body>
<div id="demo_menu" style="position:fixed;bottom:10px;left:10px;z-index:999;"><a style="color:#fff;" href="/">返回</a></div>
<div id="monitor" style="">scrollTop: 0</div>
<div id="juice"><div class="inner"></div></div>
<div id="mid"><div class="inner"></div></div>
<div id="bottle">
<div class="header"></div>
<div class="content"></div>
<div class="footer"></div>
</div>
</body>
</html>
基于jQuery实现的随滚动条增减的汽水瓶中的液体.zip
版权申诉
21 浏览量
2022-11-10
00:25:25
上传
评论
收藏 308KB ZIP 举报
基于jQuery实现的随滚动条增减的汽水瓶中的液体.zip （9个子文件） 
132687006804119619 likecs.com_132687006819684544 
jquery-1.6.2.min.js 89KB index.htm.bak 2KB
bottle_top.png 182KB index.htm 2KB strohalm_mid.png 2KB juice.png 12KB content_bg.png 9KB bg_site.png 47KB bg_footer.png 30KB资源评论
