网页对联广告代码效果大全
来源:互联网 发布:怎么下载淘宝搜索量 编辑:程序博客网 时间:2024/06/10 23:57
现在很多网站广告做的如火如荼,现在我就来介绍一下常见的对联浮动广告效果的代码使用方法,介绍的这种效果,在1024*768分辨率下正常显示,在800*600的分辨率下可以自动隐藏,以免遮住页面影响访问者浏览内容,下面就是实现效果所需代码:
把上面的代码另存为一个JS文件,然后在想实现此效果的页面用 调用即可!注意修改广告图片地址和连接地址!
把上面的代码另存为一个JS文件,然后在想实现此效果的页面用 调用即可,*代表你另存的文件名!注意修改广告图片地址和连接地址!
把上面的代码另存为一个*.JS文件,然后在想实现此效果的页面用
var delta=0.015 var collection; function floaters() { this.items = []; this.addItem = function(id,x,y,content) { document.write('<DIV id='+id+' style="Z-INDEX: 0; POSITION: absolute; width:80px; height:60px;left:'+(typeof(x)=='string'?eval(x):x)+';top:'+(typeof(y)=='string'?eval(y):y)+'">'+content+'</DIV>'); var newItem = {}; newItem.object = document.getElementById(id); newItem.x = x; newItem.y = y; this.items[this.items.length] = newItem; } this.play = function() { collection = this.items setInterval('play()',10); } } function play() { if(screen.width<=800) { for(var i=0;i<collection.length;i++) { collection[i].object.style.display = 'none'; } return; } for(var i=0;i<collection.length;i++) { var followObj = collection[i].object; var followObj_x = (typeof(collection[i].x)=='string'?eval(collection[i].x):collection[i].x); var followObj_y = (typeof(collection[i].y)=='string'?eval(collection[i].y):collection[i].y); if(followObj.offsetLeft!=(document.body.scrollLeft+followObj_x)) { var dx=(document.body.scrollLeft+followObj_x-followObj.offsetLeft)*delta; dx=(dx>0?1:-1)*Math.ceil(Math.abs(dx)); followObj.style.left=followObj.offsetLeft+dx; } if(followObj.offsetTop!=(document.body.scrollTop+followObj_y)) { var dy=(document.body.scrollTop+followObj_y-followObj.offsetTop)*delta; dy=(dy>0?1:-1)*Math.ceil(Math.abs(dy)); followObj.style.top=followObj.offsetTop+dy; } followObj.style.display = ''; } } var theFloaters = new floaters(); theFloaters.addItem('followDiv1','document.body.clientWidth-100',0,'</a><br><a href=广告链接地址 target=_blank><img src=广告图片地址 width=100 height=400 border=0></a>'); theFloaters.addItem('followDiv2',0,0,'<br><a href=广告链接地址 target=_blank><img src=广告图片地址 width=100 height=400 border=0></a>'); theFloaters.play();
把上面的代码另存为一个JS文件,然后在想实现此效果的页面用 调用即可!注意修改广告图片地址和连接地址!
鼠标感应
function bigshow(){document.all.div_250.style.visibility = 'visible';document.all.div_80.style.visibility = 'hidden';}function bighide(){document.all.div_80.style.visibility = 'visible';document.all.div_250.style.visibility = 'hidden';}var ad_80= new Array(1);var ad_250= new Array(1);ad_80[0]="<a href=http://www.dfeng.net target=_blank><img src=/skin/adv43/ad/ad_ad.gif border=0></a>";ad_250[0]="<a href=http://www.dfeng.net target=_blank><img src=/skin/adv43/ad/ad_ad2.gif border=0></a>";var imgheight;var fubioleft;window.screen.width>800 ? fubioleft=15:fubioleft=15document.write('<DIV id=floater_left style="Z-INDEX: 25; LEFT:'+fubioleft+'px; WIDTH: 28px;POSITION: absolute; TOP: 42px; HEIGHT: 22px">');ad_now = new Date();ad_id= ad_now.getSeconds() %1 var adhead1="<div id=div_80 style='position:absolute; width:95px; height:62px; z-index:12' onMouseOver=bigshow();>";var adhead2="</div><div id=div_250 style='position:absolute; visibility: hidden; z-index:13;width: 80; height: 60' onMouseOut=bighide();>";//var adhead1="<div id=div_80 style='position:absolute; width:95px; height:62px; z-index:20' onMouseOut='//MM_showHideLayers(\"div_250\",\"\",\"hide\")' onMouseOver='MM_showHideLayers(\"div_250\",\"\",\"show\")'>";//var adhead2="</div><div id=div_250 style='position:absolute; z-index:21;visibility: hidden; width: 80; height: 60' onMouseOver='MM_showHideLayers(\"div_250\",\"\",\"show\")' onMouseOut='MM_showHideLayers(\"div_250\",\"\",\"hide\")'>";document.write(adhead1+ad_80[ad_id]+adhead2+ad_250[ad_id]+"</div>"); document.write ("</div>");self.onError=null;currentX = currentY = 0; whichIt = null; lastScrollX = 0; lastScrollY = 0; NS = (document.layers) ? 1 : 0; IE = (document.all) ? 1: 0; function heartBeat() { if(IE) { diffY = document.body.scrollTop; diffX = document.body.scrollLeft; } if(NS) { diffY = self.pageYOffset; diffX = self.pageXOffset; } if(diffY != lastScrollY) { percent = .5 * (diffY - lastScrollY); if(percent > 0) percent = Math.ceil(percent); else percent = Math.floor(percent); if(IE) document.all.floater_left.style.pixelTop += percent; if(NS) document.floater_left.top += percent; lastScrollY = lastScrollY + percent; } if(diffX != lastScrollX) { percent = .5 * (diffX - lastScrollX); if(percent > 0) percent = Math.ceil(percent); else percent = Math.floor(percent); if(IE) document.all.floater_left.style.pixelLeft += percent; if(NS) document.floater_left.left += percent; lastScrollX = lastScrollX + percent; } } if(NS || IE) action = window.setInterval("heartBeat()",1);var ad_80= new Array(1);var ad_250= new Array(1);ad_80[0]="<a href=http://www.dfeng.net target=_blank><img src=/skin/adv43/ad/ad_ad.jpg border=0></a>";ad_250[0]="<a href=http://www.dfeng.net target=_blank><img src=/skin/adv43/ad/ad_ad.jpg border=0></a>";var imgheight;var fubioleft;window.screen.width>800 ? fubioleft=15:fubioleft=15document.write('<DIV id=floater_right style="Z-INDEX: 25; LEFT:'+fubioleft+'px; WIDTH: 28px;POSITION: absolute; TOP: 42px; HEIGHT: 22px">');ad_now = new Date();ad_id= ad_now.getSeconds() %1function myload(){if (navigator.appName == "Netscape"){document.div_right_80.pageX=+window.innerWidth-130;document.div_right_250.pageX=+window.innerWidth-300;mymove();}else{div_right_80.style.left=document.body.offsetWidth-130;div_right_250.style.left=document.body.offsetWidth-300;mymove();}}function mymove(){if(document.ns){document.div_right_80.left=pageXOffset+window.innerWidth-130;document.div_right_250.left=pageXOffset+window.innerWidth-300;setTimeout("mymove();",20)}else{div_right_80.style.left=document.body.scrollLeft+document.body.offsetWidth-145;div_right_250.style.left=document.body.scrollLeft+document.body.offsetWidth-300;setTimeout("mymove();",20)}} var adhead1="<div id=div_right_80 style='position:absolute; width:95px; height:60px; z-index:12' onMouseOver=bigshow_right();>";var adhead2="</div><div id=div_right_250 style='position:absolute; visibility: hidden; z-index:13;width: 250; height: 250' onMouseOut=bighide_right();><div align=right>";document.write(adhead1+ad_80[ad_id]+adhead2+ad_250[ad_id]+"</div></div>");myload()document.write ("</div>");self.onError=null;currentX_right = currentY_right = 0; whichIt_right = null; lastScrollX_right = 0; lastScrollY_right = 0; NS = (document.layers) ? 1 : 0; IE = (document.all) ? 1: 0; function heartBeat_right() { if(IE) { diffY_right = document.body.scrollTop; diffX_right = document.body.scrollLeft; } if(NS) { diffY_right = self.pageYOffset; diffX_right = self.pageXOffset; } if(diffY_right != lastScrollY_right) { percent_right = .5 * (diffY_right - lastScrollY_right); if(percent_right > 0) percent_right = Math.ceil(percent_right); else percent_right = Math.floor(percent_right); if(IE) document.all.floater_right.style.pixelTop += percent_right; if(NS) document.floater_right.top += percent_right; lastScrollY_right = lastScrollY_right + percent_right; } if(diffX_right != lastScrollX_right) { percent_right = .5 * (diffX_right - lastScrollX_right); if(percent_right > 0) percent_right = Math.ceil(percent_right); else percent_right = Math.floor(percent_right); if(IE) document.all.floater_right.style.pixelLeft += percent_right; if(NS) document.floater_right.left += percent_right; lastScrollX_right = lastScrollX_right + percent_right; } } if(NS || IE) action = window.setInterval("heartBeat_right()",1);function bigshow_right(){document.all.div_right_250.style.visibility = 'visible';document.all.div_right_80.style.visibility = 'hidden';}function bighide_right(){document.all.div_right_80.style.visibility = 'visible';document.all.div_right_250.style.visibility = 'hidden';}document.write('');document.write('');document.write('');
与前面一个代码不同的是,当鼠标移动到广告图片上是可以感应显示另外设置好的广告大图效果,下面就是实现效果所需代码:
把上面的代码另存为一个JS文件,然后在想实现此效果的页面用
<script type="text/javascript" language="javascript1.2" src="*.js"></SCRIPT>
调用即可,*代表你另存的文件名!注意修改广告图片地址和连接地址!
与前面两个代码不同的是,广告图下方增加了一个图片按纽,允许访客点击关闭广告图片,下面文本框中就是实现效果所需代码:
var delta=0.015;var collection;var closeB=false;function floaters() { this.items = []; this.addItem = function(id,x,y,content) { document.write('<DIV id='+id+' style="Z-INDEX: 10; POSITION: absolute; width:80px; height:60px;left:'+(typeof(x)=='string'?eval(x):x)+';top:'+(typeof(y)=='string'?eval(y):y)+'">'+content+'</DIV>'); var newItem = {}; newItem.object = document.getElementById(id); newItem.x = x; newItem.y = y; this.items[this.items.length] = newItem; } this.play = function() { collection = this.items setInterval('play()',30); } } function play() { if(screen.width<=800 || closeB) { for(var i=0;i<collection.length;i++) { collection[i].object.style.display = 'none'; } return; } for(var i=0;i<collection.length;i++) { var followObj = collection[i].object; var followObj_x = (typeof(collection[i].x)=='string'?eval(collection[i].x):collection[i].x); var followObj_y = (typeof(collection[i].y)=='string'?eval(collection[i].y):collection[i].y); if(followObj.offsetLeft!=(document.body.scrollLeft+followObj_x)) { var dx=(document.body.scrollLeft+followObj_x-followObj.offsetLeft)*delta; dx=(dx>0?1:-1)*Math.ceil(Math.abs(dx)); followObj.style.left=followObj.offsetLeft+dx; } if(followObj.offsetTop!=(document.body.scrollTop+followObj_y)) { var dy=(document.body.scrollTop+followObj_y-followObj.offsetTop)*delta; dy=(dy>0?1:-1)*Math.ceil(Math.abs(dy)); followObj.style.top=followObj.offsetTop+dy; } followObj.style.display = ''; } } function closeBanner() { closeB=true; return; }var theFloaters = new floaters();//theFloaters.addItem('followDiv1','document.body.clientWidth-100',0,'<a onClick="closeBanner();" href=http://www.dfeng.net target=_blank><img src=ad/doublead/right.gif width=100 height=554 border=0></a><br><br><img src=ad/doublead/close.gif onClick="closeBanner();">');theFloaters.addItem('followDiv2',0,0,'<a onClick="closeBanner();" href=http://www.dfeng.net target=_blank><img src=ad/doublead/ad_ad.gif width=100 height=400 border=0 ></a><br><br><img src=ad/doublead/close.gif onClick="closeBanner();">');theFloaters.play();
把上面的代码另存为一个JS文件,然后在想实现此效果的页面用 调用即可,*代表你另存的文件名!注意修改广告图片地址和连接地址!
浮动对联广告---之左侧代码
如果您想只有一侧显示的话,下面是实现左侧效果所需代码:
var ad_float_left_src ="图片地址";var ad_float_left_url ="地址";var ad_float_left_type = "";document.ns = navigator.appName == "Microsoft Internet Explorer"var imgheight_closevar imgleftwindow.screen.width>800 ? imgheight_close=120:imgheight_close=120window.screen.width>800 ? imgleft=8:imgleft=122function myload(){myleft.style.top=document.body.scrollTop+document.body.offsetHeight-imgheight_close;myleft.style.left=imgleft;leftmove();}function leftmove(){myleft.style.top=document.body.scrollTop+document.body.offsetHeight-imgheight_close;myleft.style.left=imgleft;setTimeout("leftmove();",50)}function MM_reloadPage(init) { //reloads the window if Nav4resized if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) { document.MM_pgW=innerWidth; document.MM_pgH=innerHeight;onresize=MM_reloadPage; }} else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();}MM_reloadPage(true)function close_float_left(){myleft.style.visibility='hidden';}document.write("<div id=myleft style='position:absolute;width:80;top:300;left:5;visibility: visible;z-index: 1'>"+"<style>"+"A.closefloat:link,A.refloat:visited {text-decoration:none;color:#000000;font-size:12px}"+"A.closefloat:active,A.refloat:hover {text-decoration:underline;color:#0000FF;font-size:12px}"+"</style>"+"<table border=0 cellpadding=0 cellspacing=0><tr><td>");if(document.ns){if(ad_float_left_type!="swf")document.write("<a href='" + ad_float_left_url + "' target= '_blank'><img src='" + ad_float_left_src + "' WIDTH=88height=31 border=0></a>");elsedocument.write("<EMBED src='" + ad_float_left_src + "'quality=high WIDTH=80 HEIGHT=80 TYPE='application/x-shockwave-flash' id=changhongout ></EMBED>");document.write("</td></tr><tr><td width=80 height=20align=right><a href='javascript:close_float_left();void(0);'class=closefloat><b><font color=#ff0000>关闭</font></b></a></td></tr>"+"</table>"+"</div>");myload()}
把上面的代码另存为一个*.JS文件,然后在想实现此效果的页面用
<script src="*.js"></SCRIPT>
调用即可,*代表你另存的文件名!注意修改广告图片地址和连接地址!相应的参数可以根据页面自行调整。
- 网页对联广告代码效果大全
- 对联广告代码效果大全
- 对联广告代码效果大全
- 对联广告代码效果大全
- 对联广告代码效果大全
- 对联广告代码效果大全
- 对联广告JS代码效果大全
- 网页两边对联广告效果
- 网页JS弹出广告代码,头部,右下角,网页中漂浮,对联广告代码等大全
- JS常用脚本+html代码大全+对联广告代码效果大全
- 网页两边的对联广告代码
- 网页刷新的js 对联广告代码
- 对联广告代码效果[鼠标感应]
- 页面两侧对联广告代码效果
- 对联广告代码效果[鼠标感应]
- 网页对联广告
- 网页对联广告
- 网页对联广告
- php5中this,self,parent的意义
- HibernateTemplate的原理与hibernate三态
- django入门笔记4- template
- CentOS 5.5上安装ORACLE 11g R2最完全安装教程
- NYOJ 514 数字 1的个数
- 网页对联广告代码效果大全
- Oracle基础——第六章 查询
- [jBPM5 部署] 最可靠,最简洁方式
- 处境好难的毕业生
- 矩阵快速幂好题PvZ once again
- ZOJ 1076 Gene Assembly(LIS)
- Android zygote与进程创建(一)
- 大师推荐的Oracle数据库相关的书籍,收集汇总。
- PHP自学之路-----PHP基础数据类型及运算符介绍