很像杂志网站,通常会有一个弹出框,在访问时要求订阅。
我基本上有同样的事情,但我希望它不会出现一段时间,比如说一周,如果他们点击“不要显示”。
fid:https://jsfiddle.net/jzhang172/jh3L5kox/
window.onload=func1();
function func1(){
$('.pop-up').fadeIn();
}
$('.nope').click(function(){
$('.pop-up').fadeOut();
});
body,html{
padding:0;
margin:0;
}
*{
box-sizing:border-box;
}
.overlay{
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
background:black;
}
.pop-up {
height: 40vw;
width: 40vw;
position: fixed;
top: 50%;
left: 50%;
margin-left: -20vw;
margin-top: -20vw;
background: rgba(255, 255, 255, 0.83);
text-align: center;
border:1px solid black;
box-shadow: 1px 1px 39px 5px #584B4B;
}
.nope{
text-decoration:underline;
cursor:pointer;
font-size:13px;
}
.pop-up{
display:none;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="overlay">
<div class="pop-up">
<h2>Subscribe to be Awesome</h2>
<span class="nope">Don't be awesome</span>
</div>
</div>
答案 0 :(得分:3)
您可以使用Cookie来显示/隐藏弹出窗口。
1-当用户点击关闭弹出窗口时设置一个cookie。
@Setter
2-在文档加载时获取cookie。如果您的cookie存在,请隐藏弹出窗口其他节目
$('.nope').click(function(){
document.cookie="mycookie=my_cookie_value; expires=Thu, 28 Apr 2016 12:00:00 UTC; path=/";
$('.pop-up').fadeOut();
});
每次浏览器加载时都需要检查cookie。用您的值替换变量和if条件。有关cookie的更多信息,请访问http://www.w3schools.com/js/js_cookies.asp