网页弹窗广告(网页每天首次打开弹出广告,此后刷新不再显示)

类似京东双十一广告效果,网页每天首次打开弹出广告,此后的有效时间内刷新将不再显示。


1.导入jQuery文件和cookie文件,如图:



2.定义弹窗层代码


3.添加css样式
*html .advbox{position:absolute;top:expression(eval(document.documentElement.scrollTop));}
.advbox{width:670px;position:fixed;display:none;left:50%;top:0;margin:-215px 0 0 -325px;}
.advbox .advpic{position:relative;height:420px;overflow:hidden;}
.advbox .closebtn{display:block;width:40px;height:20px;line-height:20px;font-size:12px;color:#fff;text-indent:12px;overflow:hidden;position:absolute;right:5px;top:0px;z-index:99;}

4.添加jQuery代码
$(document).ready(function(){
   var COOKIE_NAME = "showbox";
	if($.cookie(COOKIE_NAME)){
		$(".advbox").hide();
	}else{
		$(".advbox").show();
		$(".advbox").animate({top:"50%"},1000);
		$(".closebtn").click(function(){
			$(".advbox").fadeOut(500);
	})
	$.cookie(COOKIE_NAME,'ishide',{expires:1});//expires过期时间
	}
})
 注意:expires过期时间可以根据自己需要更改,如1/2半天等。



你可能感兴趣的:(jQuery)