|
|
| 跟随滚动条弹性移动的图片 |
| 整理:Cnwshow.Com 来源:Internet 整理时间:2008-8-22 |
|
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>跟随滚动条弹性移动的图片</title>
</head>
<body>
<STYLE type="text/css">
#floater {
POSITION: absolute; HEIGHT: 0px;
}
</STYLE>
<script language="JavaScript">
<!--
var Xpos = 0;
var Ypos = 0;
var Ygravity = 0.9;
var scrollPos = 0;
var oldScrollPos = 0;
function FloatMenu() {
docWidth = 700; // update document width
docHeight = document.body.clientHeight; // update document height
oldScrollPos = scrollPos;
scrollPos = document.body.scrollTop; // update scrollbar position
//if(scrollPos > 600) scrollPos = 580;
Xpos = docWidth;
Yboundary = scrollPos + 400;
if (floater.offsetTop < Yboundary - 10) // Object is behind boundary
Ypos += 3;
if (floater.offsetTop > Yboundary + 10) // Object is past boundary
Ypos -= 3;
Ypos *= Ygravity; // Slow object down
floater.style.pixelLeft = Xpos + 130;
floater.style.pixelTop += Ypos; // Make object bounce
}
window.setInterval("FloatMenu()", 30);
//-->
</script>
<div id=floater border="0">
<a href="#"><img src=rmb.jpg border=0 width="172" height="90"></a>
</div>
<table border="0" cellpadding="0" cellspacing="0" width="100%" height="151%" id="table1">
<tr>
<td> </td>
</tr>
</table>
</body>
</html>
|
|
|
|
|
|