Local Storage toggle banner - appearing quickly when refreshing


I have the following jQuery toggle which hides/shows a banner and remembers it’s state using local storage.

However, if I close the banner so it’s in it’s closed state and refresh the page, the banner appears for a split second and then hides again.

Is there a way to stop this from happening?


I’d use some CSS to initially hide it, which prevents it from showing at the start:

.covid-19-banner {
    display: none;

then update the JavaScript to use toggle, which lets us tell it that it shows when pb isn’t true.

    // if (pb == "true") {
    //   jQuery(".covid-19-banner").hide();
    // }
    jQuery(".covid-19-banner").toggle(pb !== "true");

Thank you, that worked perfectly :smiley:

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.