クリックイベントをローカルストレージに保存して、ユーザーからポップアップを非表示にする方法。彼は[同意する]を1回クリックする必要があります。彼が[キャンセル]をクリックすると、ポップアップが再び開きます
https://jsfiddle.net/npdqq2dt/5/
<div id="overlay">
<div class="popup">
<div id="popup_terms">
blablabla
</div>
<button id="accept" type="button">accept</button>
<button id="cancel" type="button">cancel</button>
</div>
</div>
#overlay {
position: fixed;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.45);
z-index: 999;
-webkit-animation: fade .6s;
-moz-animation: fade .6s;
animation: fade .6s;
overflow: auto;
}
.popup {
color: #525252;
background: #0c2333;
top: 20%;
left: 0px;
right: 0;
font-size: 14px;
margin: auto;
width: 65%;
height: 600px;
min-width: 350px;
max-width: 100%;
position: absolute;
padding: 40px 65px;
z-index: 1000;
}
JQueryを使用してソリューションを提供できますか？ありがとう
ローカルストレージを操作するためにjQueryは必要ありません。ここに簡単な例があります：
$(function() {
if (localStorage.getItem('popup_accepted')) {
$('#overlay').remove();
} else {
$('#accept').click(function() {
localStorage.setItem('popup_accepted');
$('#overlay').remove();
});
$('#cancel').click(function() {
$('#overlay').remove();
});
}
});
スニペットにアクセスできないため、機能するスニペットを作成できませんlocalStorage。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加