<%
String path = Request.getcontextpath ();
%>
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<meta charset= "UTF-8" >
<title> Untitled Page </title>
<style type= "Text/css" >
. scrolldiv{
width:100px;
height:200px;
Position:absolute;
top:300px;
left:30px;
background-color:red;
}
</style>
<script type= "Text/javascript" src= "<%=path%>/bbs/js/jquery-1.10.2.js" ></script>
<body style= "width:2000px;height:8000px" >
<div class= "Scrolldiv" id= "Scrolldiv" ></div>
</body>
<script type= "Text/javascript" >
var timer;
$ (function () {
$ (window). Scroll (function () {
Clearinterval (timer);
var topscroll=getscroll ();
var topdiv= "1px";
var top=topscroll+parseint (Topdiv);
Timer=setinterval (function () {
$ (". Test"). CSS ("Top", top+ "px");
$ (". Scrolldiv"). Animate ({"Top": top},500);
},500)
})
})
function Getscroll () {
var bodytop = 0;
if (typeof window.pageyoffset! = ' undefined ') {
Bodytop = Window.pageyoffset;
} else if (typeof document.compatmode! = ' undefined ' && document.compatmode! = ' Backcompat ') {
Bodytop = Document.documentElement.scrollTop;
}
else if (typeof document.body! = ' undefined ') {
Bodytop = Document.body.scrollTop;
}
Return Bodytop
}
</script>
Div moves relative to the browser