我写的简易浮动广告的代码

这个很多网站上都有了,我也自己写了一段简单的代码,直接上代码吧:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title></title>
</head>

<body>
<div id="ActiveLayer" style="position:absolute;left:80px;top:121px;width:201px;height:149px;z-index:1;">显示内容</div>
<div style="height:2000px"></div>
<script type="text/javascript">
var interal = 5;
var oldPos,newPos;
var iclock;
var layerX = 100;    // 高度
function moveLayer()
{
    
var oldPos = document.getElementById("ActiveLayer").style.top;
    
if(!oldPos)
    {
        oldPos 
= 0;
    }
    
else if(oldPos.indexOf("px")>0)
    {
        oldPos 
= parseInt(oldPos.substring(0,oldPos.length-2));
    }
    
    
var newPos =  document.body.scrollTop + layerX;
    
    
if(newPos-oldPos > interal || newPos-oldPos < (interal * -1))
    {
        
if(newPos>oldPos) oldPos += interal; else oldPos -= interal;
        
        document.getElementById(
"ActiveLayer").style.top = oldPos;
    }
    
else
    {
        window.clearInterval(iclock);
    }
}

window.onscroll 
= function()
{
    window.clearInterval(iclock);
    iclock
=window.setInterval('moveLayer();',5);
}
</script>
</body>
</html>

 

 

把上面的代码保存可以看到效果,如果页面标头指定了:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

 

需要把代码中的document.body.scrollTop 替换为 document.documentElement.scrollTop
posted @ 2010-03-11 16:48  魔豆  阅读(485)  评论(0编辑  收藏  举报