<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
</head>
<body>
<pre>
r
rg
r
g
g
</pre>
<div style="background:green;width:300px;height:300px;"></div>
<pre>
rg
r
gf
gf
g
fgf
gf
g
f
g
g
f
g
fr
r
gr
g
r
g
r
</pre>
<script type="text/javascript"src="jquery-1.5.js"></script>
<script type="text/javascript">
var i=0;
$(window).scroll(function(){
if($("div").offset().top==$(document).scrollTop()){
j=$(document).scrollTop();
if(j>i){
$("div").css("position","fixed");
$("div").css("top",0);
}
i=j;
}else{
j=$(document).scrollTop();
i=j;
$("div").css("position","static");
}
});
</script>
</body>
</html>
我想使滚动条向下移动时,当可视区上边与div接触时,div随着一起下移。滚动条上移时,div也随着一起移动,但在原来的区域落下来。一轮过后div位置没变.谢谢各位了
------解决方案--------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function getTop(dom){
var top=0;
if(document.defaultView&&document.defaultView.getComputedStyle){
top=document.defaultView.getComputedStyle(dom).top;
}else{
top=dom.currentStyle.top;
}
top=top=='auto'?dom.offsetTop:top;
return top;
}
window.onload=function(){
var div=document.getElementsByTagName("div")[0];
var top=getTop(div);
window.onscroll=function(){
var db=document.body;
var de=document.documentElement
------解决方案--------------------
db;
var sctop=de.scrollTop>db.scrollTop?de.scrollTop:db.scrollTop;
if(sctop>=parseInt(top)){
div.style.position='fixed';
div.style.top='0px';
}else{
div.style.position='static';
div.style.top=top;
}
}
}
</script>
</head>
<body>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
</head>
<body>
<pre>
r
rg
r
g
g
div位置
</pre>
<div style="background:green;width:300px;height:300px;"></div>
<pre>
rg
r
gf
gf
g
fgf
gf
g
f
g
g
f