Создайте одноразовое всплывающее окно с материализацией css

Question

Есть ли способ уклониться от jquery и сделать так, чтобы уведомление отображалось только один раз для браузера?

Например, заходит на веб-сайт, появляется уведомление, и вот оно, в следующий раз, когда пользователь заходит на сайт из того же браузера не будет показывать ему уведомление.

Я бы в основном попытался уклониться от добавления jquery только для этого, так что если кто-нибудь знает способ сделать это с помощью css или некоторого простого html Я был бы благодарен.

Answer 1

Как вы запускаете уведомление?

Вы можете выполнить базовую проверку c localStorage, например, чтобы "определить", было ли отображено уведомление:

function foo() {

  const hasSeenNotification = window.localStorage.getItem('shown');
  if (!hasSeenNotification) {

    window.localStorage.setItem('shown', true);

    // show notification here
    // ...
  }

}

Answer 2

Вам нужно добавить куки, а затем проверить, существует ли он

if (GetCookieShowMessageDocument ('ShowPoPUP')) {...}

вот пример:

 function GetCookieShowMessageDocument(c_name) {
        var i, x, y, ARRcookies = document.cookie.split(";");
        for (i = 0; i < ARRcookies.length; i++) {
            x = ARRcookies[i].substr(0, ARRcookies[i].indexOf("="));
            y = ARRcookies[i].substr(ARRcookies[i].indexOf("=") + 1);
            x = x.replace(/^\s+|\s+$/g, "");
            if (x == c_name) {
                return unescape(y);
            }
        }
    }

    function SetCookieShowMessageDocument(name, value, days) {
        if (days) {
            var date = new Date();
            date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
            var expires = "; expires=" + date.toGMTString();
        }
        else var expires = "";
        document.cookie = name + "=" + escape(value) + expires + "; path=/";
    }