纯css完美实现对联广告效果代码

来源：互联网   发布日期：2016-03-25 16:28:03   浏览：1381次  

本文章提供的对联广告是完全使用css实现的，并且兼容所有浏览器，包括各种ie,ff,gg浏览器哦，代码简洁好用，有需要的朋友可参考。

css 代码

代码如下

复制代码

.couplet_ad

/* 底部固定*/{position:fixed;bottom:auto; top:0; width: 120px; height: 230px; z-index:99999; margin-top:158px;}

* html .couplet_ad

/* IE6 底部固定*/{_position:absolute;

_bottom:auto;

_top:expression(eval(document.documentElement.scrollTop));}

.couplet_ad a{ display:block; cursor:pointer;}

#ad_left{ left: 0px;}

#ad_right{ right: 0px;}

html代码(下代码直接放到html中即可)

对联广告左边

代码如下

复制代码

<div class="couplet_ad" id="ad_left">

<a target="_blank" href=""><img src="dl.jpg"></a>

<a onClick="ad_left();">关闭</a>

</div>

对联广告右边

代码如下

复制代码

<div class="couplet_ad" id="ad_right">

<a target="_blank" href=""><img src="dl.jpg"></a>

<aonClick="ad_right();">关闭</a>

</div>

这个js是关闭按钮代码

代码如下

复制代码

<script language="javascript">

function ad_left(){

document.getElementById('ad_left').style.display="none";

}

function ad_right(){

document.getElementById('ad_right').style.display="none";

}

</script>

赞助本站