享受快乐 2008-4-27 13:45
网页两侧浮动层代码
我们上网常常可以看到有的网站的两侧会有跟随鼠标上下移动的一个广告的图片,
它是怎么实现的呢?其实方法很多,网上也有很多代码.但有的却不好用,有的却不是那样移动的.
下面给大家分享一下,我的这个浮动层代码吧,我在是好使的.
大家可以先看看效果,是不是你想要的.[url=http://www.jrsykj.com/]www.jrsykj.com[/url]
代码如下:
首先,你要先建个.JS文件,如果你用dreawmeaver的话,直接在"新建"里选择基本页,然后选择 Javescript
把下面代码复制到里面就可以了:
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("adright").style.top=parseInt(document.getElementById("adright").style.top)+percent+"px";
//document.getElementById("adleft").style.top=parseInt(document.getElementById("adleft").style.top)+percent+"px";
lastScrollY=lastScrollY+percent;
//alert(lastScrollY);
}
adright="<DIV id=\"adright\" style='right:-5px; pOSITION:absolute;TOP:200px;'[color=red][color=black]>[/color]<table><tr><td height=140 width=107 background=images/kefu.gif align=center><a target=blank href=http://wpa.qq.com/msgrd?V=1&Uin=229261649&Site=巨融实业&Menu=yes><img border=0 src=http://wpa.qq.com/pa?p=1:229261649:10 alt=229261649></a></td></tr></table>[/color]</div>"
//adleft="<DIV id=\"adleft\" style='left:5px; pOSITION:absolute;TOP:100px;'><a href='gs.asp?wp=24'><img border=0 src=images/notice.gif></a></div>"
document.write(adright);
//document.write(adleft);
window.setInterval("heartBeat()",1);
红色的代码是根据你自己的网站修改的.
接下来你可以在你要插入的浮动层的网页中插入你刚刚建立的JS文件.
插入代码如下:
<SCRIPT language="JavaScript" src="你刚刚建的文件名.js" ></SCRIPT>
这样就好啦,试试效果吧!