js+cookie实现页脚固定广告条代码
以上只是部份演示图片，详细可以付费购买。
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>js+cookie实现页脚固定广告条代码</title>
<style type="text/css">
.float_mask{position: fixed;z-index: 19999;display:none;width: 100%;right: 0; bottom: 0;height: 105px;_bottom: auto;_width: 100%;_position: absolute;
_top: expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));}
.float_layer{position: absolute;left: 0;top: 0;z-index: 1;width: 100%;height: 100%;background: #071828;filter: alpha(opacity=80);opacity: 0.80;}
.float_content{ position: relative;z-index: 2;width: 1005px;height: 100%;margin: 0 auto;padding-left: 70px;}
.float_bg, .float_close{ float: left;}
.float_bg{position: relative;width: 820px;height: 135px;margin-top: -27px;}
.float_slogan {position: absolute; background: url("//xcdn.php.cn/js/ads/js+cookie实现页脚固定广告条代码/footer_ad.png") 0 0 no-repeat;}
.float_slogan{left: 0;bottom: 0;width: 800px;height: 135px;cursor: pointer;}
.float_close{width: 60px;margin-top: 30px;}
.float_close a {display: block;width: 53px; height: 52px; margin-left: 7px; background: url("//xcdn.php.cn/js/ads/js+cookie实现页脚固定广告条代码/close.png") 0 0 no-repeat;-webkit-transition: all 400ms;}
</style>
</head>
<body>
<div id="main">
<div class="demo">
<p style="text-align:center;font-size:18px;line-height:26px;padding:50px 0 20px 0">请看页脚广告条<br/>向下滚动试试。</p>
<div style="height:1200px;width:100%;background-color:#f6f6f6">
</div>
</div>
</div>
<div class="float_mask" id="float_mask">
<div class="float_layer">
</div>
<div class="float_content clearfix">
<div class="float_bg">
<a target="_blank" href="http://www.niuniubbs.com/" title='广告部分'>
<div class="float_slogan"><!--广告内容--></div>
</a>
</div>
<div class="float_close">
<a href="#" title="我知道了"></a>
</div>
</div>
</div>
<script>
window.onload = function(){
if(getCookie("footad")==0){
document.getElementById("float_mask").style.display="none";
}else{
document.getElementById("float_mask").style.display="block";
}
}
//关闭底部广告
function closeFootAd() {
document.getElementById("float_mask").style.display="none";
setCookie("footad","0");
}
//设置cookie
function setCookie(name,value){
var exp = new Date();
exp.setTime(exp.getTime() + 1*60*60*1000);//有效期1小时
document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
}
//取cookies函数
function getCookie(name){
var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
if(arr != null) return unescape(arr); return null;
}
</script>
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
<p>适用浏览器：IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗.</p>
<p>来源：<a href="https://www.niuniubbs.com/" target="_blank">牛牛论坛</a></p>
</div>
</body>
</html>
以上代码中的图片和JS，请下载到自己网站目录中使用！
页:
[1]