How to make a pop-up with user message to appear only once per day?

Question

Hi guys. I have this pop up that recognizes current users in SP 2013 and displays a message to them. I need this to display once a day when they first log in: Any help would be greatly appreciated! Here's the code:

<script>
     $(document).ready(function () {
         $("#popup").hide().fadeIn(500);
         $(".cover").fadeTo(500, 0.5);
         $("#close").on("click", function (e) {
            e.preventDefault();
            $("#popup").fadeOut(500);
            $(".cover").fadeOut(500);
        });
    });
</script>

<!--Get SharePoint User-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.SPServices/2014.02/jquery.SPServices-2014.02.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript">
    var loginName = "";
    var userid = _spPageContextInfo.userId;
    GetCurrentUser();
    function GetCurrentUser() {
        var requestUri = _spPageContextInfo.webAbsoluteUrl + "/_api/web/getuserbyid(" + userid + ")";
        var requestHeaders = { "accept" : "application/json;odata=verbose" };
        $.ajax({
        url : requestUri,
        contentType : "application/json;odata=verbose",
        headers : requestHeaders,
        success : onSuccess,
        error : onError
        });
    }
    function onSuccess(data, request) {
        var loginName = data.d.Title;
        //alert("Hello " + loginName);
    document.getElementById("userNameMessage").innerHTML = "hello" + "<b>" + loginName + "</b>";
    }
    function onError(error) {
        alert(error);
    }
</script>

Answer 1

Use localStorage . Use date as & a Boolean value.Inside OnSuccess function retrieve localStorage key and check if the date key is same as cuurent date. If same and if its' value is true which mean the messsage is shown if the date key and current date is not same then show message and update date in local storage to current date

Answer 2

You could try below logic.

 <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
    <script type="text/javascript">
        $(function () {
            var key = 'DailyReminder';
            var reminderTimeKey = 'ReminderTimes';
            var ReminderDate = localStorage.getItem(key);
            if (!ReminderDate) {
                var d = new Date();
                d.setHours(0, 0, 0, 0);
                localStorage.setItem(key, d);
                localStorage.setItem(reminderTimeKey, 1);
                alert('hi');

            } else {
                var RemindTimes = localStorage.getItem(reminderTimeKey);
                var d = new Date();
                d.setHours(0, 0, 0, 0);
                if (RemindTimes < 1 || ReminderDate != d) {                    
                    localStorage.setItem(key, d);
                    localStorage.setItem(reminderTimeKey, 1);
                    alert('hi');
                }
            }
        })
    </script>