WebStorageで1回目のアクセス時のみモーダルを表示する WebStorageで1回目のアクセス時のみモーダルを表示する

###HTML

<div id="c-modal_bg"></div>
<div id="c-modal">
    <p>モーダルの中身です。<br />
    モーダルの中身です。<br />
    モーダルの中身です。</p>
    <p><input type="checkbox" name="acs_next" value="" />次回以降表示しない</p>
    <div id="c-modal_close">閉じる</div>
</div>

###Javascript

// モーダルの処理
var bg = document.getElementById('c-modal_bg');
bg.addEventListener('click', modal_close, false);
 
var close = document.getElementById('c-modal_close');
close.addEventListener('click', modal_close, false);
 
function modal_close() {
    var modal = document.getElementById('c-modal');
    modal.style.display = 'none';
    bg.style.display = 'none';
 
    // チェックボックスにチェックが入っている場合は、次回以降表示しないようにする
    if(document.getElementsByName('acs_next')[0].checked) {
        sessionStorage.setItem('acs2', 'on');
    }
}
 
// 「次回以降表示しない」にチェックを入れていない場合
if(sessionStorage.getItem('acs2') === null) {
 
} else {
    // チェックを入れている場合はモーダルを削除
    modal_close();
}

---

ソース
http://cly7796.net/wp/javascript/display-modal-only-on-first-access-using-webstorage/