老師,請(qǐng)問如何在這個(gè)基礎(chǔ)上讓頁面在首次打開的時(shí)候自動(dòng)彈出
請(qǐng)問老師,如何在頁面首次打開彈出div層,24小時(shí)后會(huì)再次彈出。并且鎖定頁面,點(diǎn)擊登陸框以外的區(qū)域不可以關(guān)閉登陸框。
如果您覺得代碼繁瑣,您可以就我在網(wǎng)上找到的代碼講解一下,我這個(gè)代碼需要實(shí)現(xiàn)頁面居中,彈出遮罩層,并禁止?jié)L動(dòng)。麻煩老師了!
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
*{
margin:0;
padding:0;
}
.alert_windows{
display:none;
position:absolute;
z-index:10;
width:400px;
height:300px;
background:#566F93;
}
.alert_windows span{
float:right;
width:30px;
height:30px;
text-align:center;
font:15px/30px Microsoft Yahei;
cursor:pointer;
color:#333;
background:lightblue;
}
.alert_windows span:hover{
color:#EEE;
background:red;
}
</style>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.cookie.js"></script>
<script type="text/javascript">
$(function(){
if($.cookie("isClose") != 'yes'){
var winWid = $(window).width()/2 - $('.alert_windows').width()/2;
var winHig = $(window).height()/2 - $('.alert_windows').height()/2;
$(".alert_windows").css({"left":winWid,"top":-winHig*2}); //自上而下
$(".alert_windows").show();
$(".alert_windows").animate({"left":winWid,"top":winHig},1000);
$(".alert_windows span").click(function(){
$(this).parent().fadeOut(500);
$.cookie("isClose",'yes',{ expires:1/8640}); //測試十秒
//$.cookie("isClose",'yes',{ expires:1}); 一天
});
}
});
</script>
</head>
<style>
p{height:100px;background-color:#278EE6}
</style>
<body>
? ? ? ? ?<div >
? ? ? ? <p style="color:#eeeeee">測試內(nèi)容</p>
? ? <p>測試內(nèi)容</p>
<p style="color:#eeeeee">測試內(nèi)容</p>
? ? <p>測試內(nèi)容</p>
<p style="color:#eeeeee">測試內(nèi)容</p>
? ? <p>測試內(nèi)容</p>
<p style="color:#eeeeee">測試內(nèi)容</p>
? ? <p>測試內(nèi)容</p>
<p style="color:#eeeeee">測試內(nèi)容</p>
? ? <p>測試內(nèi)容</p>
<p style="color:#eeeeee">測試內(nèi)容</p>
? ? <p>測試內(nèi)容</p>
<p style="color:#eeeeee">測試內(nèi)容</p>
? ? <p>測試內(nèi)容</p>
? ? ? ? ?</div>
<div class="alert_windows" >
<span>X</span>
</div>
</body>
</html>
2015-12-24
遮蓋層div:position:fixed;width:100%;height:100%;top:0;left:0;z-index:9999;
背景用你想用的遮蓋圖,這樣不用禁止?jié)L動(dòng)了。
在遮蓋層div中放你的內(nèi)容div:position:absolute;width:300px;height:200px;top:50%;left:50%;margin:-100px 0 0 -150px;
這是一種居中方法,適用于有固定寬度和高度的。還有其他方法可以上網(wǎng)自己找。
實(shí)現(xiàn)頁面首次打開彈出div層,24小時(shí)后會(huì)再次彈出:用cookie
引入jq的cookie插件,<script type="text/javascript" src="js/jquery.cookie.js"></script>
每次打開檢查有沒有cookit:if(($.cookie("Cap") && $.cookie("Cap")==1)) 有就不彈出遮蓋層
沒有就彈出遮蓋層,并在最后生成cookit:$.cookie("Cap",1,{ path:"/",expires:1 });
這是我寫的蓋臺(tái)圖,更你找的那個(gè)基本差不多,自己動(dòng)手試試很快就明白了。