[javascript]代码库
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<head>
<title>使用JQuery实现一个图片随着滚动条滚动而滚动</title>
<style type="text/css">
*{
margin: 0px;
padding: 0px;
}
#pic
{
background:url("share.png");
width:24px;
height:88px;
position:absolute;
}
</style>
</head>
<script type="text/javascript" src="../jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function() {
//alert($(window).height()); //浏览器时下窗口可视区域高度(JQuery的获取方式)
//alert(document.documentElement.clientHeight);(JS的获取方式)
(function()
{
var positionY = ($(window).height() - $("#pic").height())/2;
//alert(positionY);
$("#pic").css("top",positionY);
$(window).scroll(function(event){
var scrollValue = document.documentElement.scrollTop || document.body.scrollTop;
//alert(scrollValue);
var topValue = scrollValue + positionY;
$("#pic").css("top",topValue+"px");
})
})();
/*
$(window).scroll(function(event){
$("#pic").css("top",document.documentElement.scrollTop+$("#pic")[0].style.top);
})
*/
});
</script>
<body id="body">
<div id="pic"></div>
<div id="content"></div>
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br />
</body>
</html>
会python真的可以为所欲为0(回)
219天前
这里还有人吗1(回)
404天前
每天面对着电脑屏幕，敲打键盘。我所面对的并不只是代码，而是一种生活方式。0(回)
629天前
鸽子
0(回)
713天前
高级设计师
by: 小蜜锋 发表于：2013-08-19 16:39:38 顶(0) | 踩(0) 回复
这是不是到达一定高度后变成fix定位？
回复评论