幾種常用JS對聯(lián)廣告代碼

我們平時在網(wǎng)站上會放一些廣告，例如：banner、對聯(lián)廣告等，要實(shí)現(xiàn)這些效果通常會使用JS代碼，那么對聯(lián)廣告代碼怎么寫呢，學(xué)無憂小編通過搜集整理出下面幾種常用JS對聯(lián)廣告代碼，看看那種適合你。
一、帶關(guān)閉的懸浮對聯(lián)廣告代碼
這種懸浮對聯(lián)廣告是最常用的一種，把下面的代碼復(fù)制保存為ad.js文件，然后在網(wǎng)頁中插入代碼<script src="js/ad.js" type="text/javascript"></script>即可，當(dāng)然記得做一張圖片，圖片如稱ad.jpg，這里設(shè)置的路徑為images，代碼如下：
var browser={ie6:function(){return((window.XMLHttpRequest==undefined)&&(ActiveXObject!=undefined))},getWindow:function(){var myHeight=0;var myWidth=0;if(typeof(window.innerWidth)=='number'){myHeight=window.innerHeight;myWidth=window.innerWidth}else if(document.documentElement){myHeight=document.documentElement.clientHeight;myWidth=document.documentElement.clientWidth}else if(document.body){myHeight=document.body.clientHeight;myWidth=document.body.clientWidth}return{'height':myHeight,'width':myWidth}},getScroll:function(){var myHeight=0;var myWidth=0;if(typeof(window.pageYOffset)=='number'){myHeight=window.pageYOffset;myWidth=window.pageXOffset}else if(document.documentElement){myHeight=document.documentElement.scrollTop;myWidth=document.documentElement.scrollLeft}else if(document.body){myHeight=document.body.scrollTop;myWidth=document.body.scrollLeft}return{'height':myHeight,'width':myWidth}},getDocWidth:function(D){if(!D)var D=document;return Math.max(Math.max(D.body.scrollWidth,D.documentElement.scrollWidth),Math.max(D.body.offsetWidth,D.documentElement.offsetWidth),Math.max(D.body.clientWidth,D.documentElement.clientWidth))},getDocHeight:function(D){if(!D)var D=document;return Math.max(Math.max(D.body.scrollHeight,D.documentElement.scrollHeight),Math.max(D.body.offsetHeight,D.documentElement.offsetHeight),Math.max(D.body.clientHeight,D.documentElement.clientHeight))}};var dom={ID:function(id){var type=typeof(id);if(type=='object')return id;if(type=='string')return document.getElementById(id);return null},insertHtml:function(html){var frag=document.createDocumentFragment();var div=document.createElement("div");div.innerHTML=html;for(var i=0,ii=div.childNodes.length;i<ii;i++){frag.appendChild(div.childNodes[i])}document.body.insertBefore(frag,document.body.firstChild)}};var myEvent={add:function(element,type,handler){var ele=dom.ID(element);if(!ele)return;if(ele.addEventListener)ele.addEventListener(type,handler,false);else if(ele.attachEvent)ele.attachEvent("on"+type,handler);else ele["on"+type]=handler},remove:function(element,type,handler){var ele=dom.ID(element);if(!ele)return;if(ele.removeEventListener)ele.removeEventListener(type,handler,false);else if(ele.detachEvent)ele.detachEvent("on"+type,handler);else ele["on"+type]=null}};var position={rightCenter:function(id){var id=dom.ID(id);var ie6=browser.ie6();var win=browser.getWindow();var ele={'height':id.clientHeight,'width':id.clientWidth};if(ie6){var scrollBar=browser.getScroll()}else{var scrollBar={'height':0,'width':0};id.style.position='fixed'}ele.top=parseInt((win.height-ele.height)/2+scrollBar.height);id.style.top=ele.top+'px';id.style.right='3px'},floatRightCenter:function(id){position.rightCenter(id);var fun=function(){position.rightCenter(id)};if(browser.ie6()){myEvent.add(window,'scroll',fun);myEvent.add(window,'resize',fun)}else{myEvent.add(window,'resize',fun)}},leftCenter:function(id){var id=dom.ID(id);var ie6=browser.ie6();var win=browser.getWindow();var ele={'height':id.clientHeight,'width':id.clientWidth};if(ie6){var scrollBar=browser.getScroll()}else{var scrollBar={'height':0,'width':0};id.style.position='fixed'}ele.top=parseInt((win.height-ele.height)/2+scrollBar.height);id.style.top=ele.top+'px';id.style.left='3px'},floatLeftCenter:function(id){position.leftCenter(id);var fun=function(){position.leftCenter(id)};if(browser.ie6()){myEvent.add(window,'scroll',fun);myEvent.add(window,'resize',fun)}else{myEvent.add(window,'resize',fun)}}};

function ad_left(){
    var html;
    html = '<div id="ad_left" style="position:absolute;width:130px;height:300px;z-index:10001"><a style="position:absolute;top:-15px;left:0;" href="javascript:void(0);" onclick="document.getElementById(\'ad_left\').style.display=\'none\'">關(guān)閉</a><a href="http://wangbatian.cn"><img src="images/ad.jpg" width="130" height="300" /></a></div>';
    dom.insertHtml(html);position.floatLeftCenter('ad_left');
}
function ad_right(){
    var html;
    html = '<div id="ad_right" style="position:absolute;width:130px;height:300px;z-index:10001"><a style="position:absolute;top:-15px;right:0;" href="javascript:void(0);" onclick="document.getElementById(\'ad_right\').style.display=\'none\'">關(guān)閉</a><a href="http://wangbatian.cn"><img src="images/ad.jpg" width="130" height="300" /></a></div>';
    dom.insertHtml(html);position.floatRightCenter('ad_right');
}
myEvent.add(window,'load',ad_left);
myEvent.add(window,'load',ad_right);

二、帶收縮的JS對聯(lián)廣告代碼
這是一種可以進(jìn)行收縮的對聯(lián)廣告JS代碼，點(diǎn)關(guān)閉并沒有真正關(guān)掉，是收縮成小方框，再點(diǎn)擊又展示出對聯(lián)廣告，把下面的代碼插入到網(wǎng)頁的<body></body>之間就OK了，記得改一下鏈接及圖片，代碼如下：
<style type="text/css">
*{margin:0;padding:0;list-style-type:none;}
a,img{border:0;color:#5e5e5e;text-decoration:none;}
body{font:12px/180% Arial, Helvetica, sans-serif, "新宋體";}
*html,*html body{background-image:url(about:blank);background-attachment:fixed;}

/* fixediv */
.fixediv{position:fixed;top:140px;z-index:9999;height:216px;width:100px;}
*html .fixediv{position:absolute;top:expression(eval(document.documentElement.scrollTop));margin:140px 0 0 0;}
.fixediv-l{left:0px;}
.fixediv-r{right:0px;}
.fixediv .btn{height:25px;background:#CCCCCC;text-align:right;line-height:25px;overflow:hidden;}
</style>

<div id="Bar1190_big" class="fixediv fixediv-l">
<div class="btn"><a href="javascript:void(0);" onClick="bar1190_hidden()">關(guān)閉</a> </div>
<a href="http://wangbatian.cn/" target="_blank"><img width="100" height="155" src="images/1.jpg" alt="" /></a>
</div>
<div id="Bar1190_small" class="fixediv fixediv-l" style="width:25px;display:none;">
<div class="btn"><a href="javascript:void(0);" onClick="bar1190_show()">展開</a></div>
<a href="http://wangbatian.cn/" target="_blank"><img width="25" height="155" src="images/2.jpg" alt="" /></a>
</div>
<div id="Bar11901_big" class="fixediv fixediv-r">
<div class="btn"><a href="javascript:void(0);" onClick="bar11901_hidden()">關(guān)閉</a> </div>
<a href="http://wangbatian.cn/" target="_blank"><img width="100" height="155" src="images/1.jpg" alt="" /></a>
</div>
<div id="Bar11901_small" class="fixediv fixediv-r" style="width:25px;display:none;">
<div class="btn"><a href="javascript:void(0);" onClick="bar11901_show()">展開</a></div>
<a href="http://wangbatian.cn/" target="_blank"><img width="25" height="155" src="images/2.jpg" alt="" /></a>
</div>
<script type="text/javascript">
function bar1190_show(){
   document.getElementById('Bar1190_big').style.display='';
   document.getElementById('Bar1190_small').style.display='none';
}
function bar1190_hidden(){
   document.getElementById('Bar1190_big').style.display='none';
   document.getElementById('Bar1190_small').style.display='';
}
var autohide1190 = setTimeout("bar1190_hidden()",5000);
function bar11901_show(){
   document.getElementById('Bar11901_big').style.display='';
   document.getElementById('Bar11901_small').style.display='none';
}
function bar11901_hidden(){
   document.getElementById('Bar11901_big').style.display='none';
   document.getElementById('Bar11901_small').style.display='';
}
var autohide11901 = setTimeout("bar11901_hidden()",5000);
</script>
<div style="text-align:center;clear:both">
</div>