Showing a DIV only the first time a website is loaded with localStorage

Question

I am trying to make this work but I have some problems.. Like the title says, I want a DIV to be showed only the first time a website is loaded. I know how to do with PHP and Cookies, but I want it with the localStorage function.

Here is my code:

<div id="loading_bg">
  ...
</div>


$(document).ready(function() {
    localStorage.setItem('wasVisited', 1);
    if (localStorage.wasVisidet !== undefined ) {
            $("#loading_bg").css('display','none');
        } else {
            $("#loading_bg").delay(5000).fadeOut(500);
        }
});

You shouldn't use double equal. https://stackoverflow.com/questions/12271750/how-to-check-if-a-variable-is-both-null-and-or-undefined-in-javascript — Mrquestion, Jun 09 '17 at 16:05

score 11 · Accepted Answer · answered Sep 30 '13 at 16:33

You are setting the localStorage flag before the if condition, so the flag wasVisited will never be undefined.

You need to set the flag inside the else block as shown below

$(document).ready(function () {
    if (localStorage.getItem('wasVisited') !== undefined) {
        $("#loading_bg").hide();
    } else {
        localStorage.setItem('wasVisited', 1);
        $("#loading_bg").delay(5000).fadeOut(500);
    }
});

Showing a DIV only the first time a website is loaded with localStorage

1 Answers1

Linked