相信这个东西很多人会喜欢,这可是昨天弄了一夜的成果,觉得不错就顶上去让更多的人看到!
特点:1、与分辨率无关,永远保持在页面两侧。
2、采用js调用可随时更换广告图片及链接。
3、可关闭功能!
演示地址:http://www.xycomic.com
下面是具体的代码和说明:
suspendcode="<DIV id=lovexin1 style='Z-INDEX: 10; LEFT: 32px; POSITION: absolute; TOP: 105px; width: 95; height: 203px;'><img src='
/skin/xy/gg/close.gif' onClick='
javascript:window.hide()' width='95' height='20' border='0' vspace='3' alt='关闭对联广告'><a href='
http://www.xybook.cn' target='_blank'><img src='
/skin/xy/gg/xy_xy.gif' width='95' height='300' border='0' alt='
对联广告位95x300招租QQ_18941789'></a></DIV>"
document.write(suspendcode);
suspendcode="<DIV id=lovexin2 style='Z-INDEX: 10; LEFT: 912px; POSITION: absolute; TOP: 105px; width: 95; height: 203px;'><img src='
/skin/xy/gg/close.gif' onClick='
javascript:window.hide()' width='95' height='20' border='0' vspace='3' alt='关闭对联广告'><a href='
http://www.xybook.cn' target='_blank'><img src='
/skin/xy/gg/xy_xy.gif' width='95' height='300' border='0' alt='
对联广告位95x300招租QQ_18941789'></a></DIV>"
document.write(suspendcode);
lastScrollY=0;
function heartBeat(){
diffY=document.body.scrollTop;
percent=.3*(diffY-lastScrollY);
if(percent>0)percent=Math.ceil(percent);
else percent=Math.floor(percent);
document.all.lovexin1.style.pixelTop+=percent;
document.all.lovexin2.style.pixelTop+=percent;
lastScrollY=lastScrollY+percent;
}
function hide()
{
lovexin1.style.visibility="hidden";
lovexin2.style.visibility="hidden";
}
window.setInterval("heartBeat()",1);
把上面代码另存为准备调用的JS文件,如:dl.js 放在你能找到的文件夹中,如:/JS/dl.js
注意把颜色部分改成你自己的图片和链接地址,绿色代码为关闭广告所用图片,蓝色为广告图片,红色为广告链接地址,黄色为说明文字。
下面是在模版中调用的方法,以动易默认的首页模版为例(注意:由于模版的改变及代码插入的位置不同,调用时要自己调整下面红色的数值。
<!--频道显示代码-->
<tr>
<td colSpan=2>
<table class=top_Channel cellSpacing=0 cellPadding=0 width="100%" border=0>
<tr>
<td align=left><div id=Layer60 style="Z-INDEX: 60; WIDTH: 10px; POSITION: absolute; HEIGHT: 10px"><div id=Layer61 style="Z-INDEX: 1; LEFT: -140px; WIDTH: 980px; POSITION: absolute; TOP: 10px; HEIGHT: 150px"><script src="{$InstallDir}js/dl.js"></script></div></div>{$Rss}{$Wap}</td>
<td align=right>{$ShowChannel}</td>
</tr>
</table>
</td>
</tr>
<!--网站Logo和banner显示代码-->
黑色为动易默认头部导航位置代码,蓝色为调用代码,绿色为调用上面你所保存的JS文件,红色相对于浏览器left左、top上的距离(在你改变模版或插入位置有变化时调整这两个数值。
说明写的已经很详细了,希望大家成功。
[1] [2] 下一页
关于 随屏滚动对联广告[可关闭、永远保持在页面两边、代码简单]
的