你要是想显示层图片就直接ad1和ad2去掉放上<img
src="显示图片地址">
复制下面代码放到js文件里就行了 导入用<script language="javascript" src="你的js文件名.js"></script>放到你的首页就可以了 你应该满意这段代码的效果吧 兼容firefoxf/ie/chrome以下是js文件代码直接复制即可:
lastScrollY=0
function heartBeat(){
var diffY
if (document.documentElement &&document.documentElement.scrollTop)
diffY = document.documentElement.scrollTop
else if (document.body)
diffY = document.body.scrollTop
else
{/*Netscape stuff*/}
//alert(diffY)
percent=.1*(diffY-lastScrollY)
if(percent>0)percent=Math.ceil(percent)
else percent=Math.floor(percent)
document.getElementById("LeftAd").style.top=parseInt(document.getElementById("LeftAd").style.top)+percent+"px"
document.getElementById("RightAd").style.top=parseInt(document.getElementById("LeftAd").style.top)+percent+"px"
lastScrollY=lastScrollY+percent
//alert(lastScrollY)
}
suspendcode12="<DIV id=LeftAd style='left:5pxPOSITION:absoluteTOP:80px'><img src='http://www.baidu.com/img/baidu_logo.gif ' ><a style='text-align:leftcursor: handdisplay:blockbackground:#eeewidth:100px' href='javascript:void(0)' onclick='javascript:ClosedivLeft()' hidefocus='true'>关闭</a></div>"
suspendcode14="<DIV id=RightAd style='right:5pxPOSITION:absoluteTOP:80px'><img src='http://www.baidu.com/img/baidu_logo.gif ' ><a style='text-align:leftcursor: handdisplay:blockbackground:#eeewidth:100px' href='javascript:void(0)' onclick='javascript:ClosedivRight()' hidefocus='true'>关闭</a></div>"
document.write(suspendcode12)
document.write(suspendcode14)
window.setInterval("heartBeat()",1)
function ClosedivLeft()
{
LeftAd.style.visibility="hidden"
}
function ClosedivRight()
{
RightAd.style.visibility="hidden"
}
<html><head>
<meta http-equiv="Content-Type" content="text/html charset=gb2312" />
<style type="text/css">
#ad1,#ad2{
-webkit-transition: all .5s ease-out
-moz-transition: all .5s ease-out
-o-transition: all .5s ease-out
transition: all .5s ease-out
POSITION:absolute
TOP:120px
width:100px
height:200px
border:1px solid red
}
</style>
</head>
<body>
<div id="mm" style="height:2000pxbackground:#f5f5f5width:500px">
</div>
<DIV id="ad1" style='left:2px'>ad1</div>
<DIV id="ad2" style='right:2px'>ad2</div>
<script language="JavaScript" type="text/javascript">
document.onscroll=function(){
document.getElementById("ad1").style.top=document.body.scrollTop+120+'px'
document.getElementById("ad2").style.top=document.body.scrollTop+120+'px'
}
</script>
</body>
</html>