Использование файлов cookie для отображения всплывающих окон на основе определенных действий

В настоящее время я использую fancybox для доставки контента во всплывающем окне через 2 секунды после загрузки страницы. Я бы хотел реализовать что-то, что устранит раздражение этого всплывающего окна каждый раз, когда загружается страница на сайте.

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

Вот код, который я сейчас использую для всплывающего окна:

// fancybox arguments
$(".fancybox")
    .attr('rel', 'gallery')
    .fancybox({
        padding : 0,
        'autoDimensions': false,
        'autoSize': false,
        'width': '650', 
        'height': 'auto'
    });


// Launch fancyBox on first element
setTimeout(function(){$(".fancybox").eq(0).trigger('click');},2000)

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

EDIT:

Здесь HTML, который используется для всплывающего окна:

<div style="display:none">
    <a class="fancybox" href="#donation-info" alt=""/></a>
    <div id="donation-info">
        <?php if (get_field('donation_box_text', 'option')){
            echo '<h2>To all our readers:</h2>';
            echo '<p>' . get_field('donation_box_text', 'option') . '</p>';
            echo '<div style="text-align:center"><a href="' . get_field('donation_link', 'option') . '" id="donate" class="donate-link" />Donate</a></div>';
        }; ?>

    </div>
</div>

Я также попробовал обновить вышеприведенную функцию, чтобы включить куки файлы, из лучших моих ожиданий, безрезультатно:

$(document).ready(function() {
        if ($.cookie('noShowDonation')) $('.fancybox').hide();
    else {
        $("#donate").click(function() {
            // fancybox arguments
                $(".fancybox")
                    .attr('rel', 'gallery')
                    .fancybox({
                        padding : 0,
                        'autoDimensions': false,
                        'autoSize': false,
                        'width': '650', 
                        'height': 'auto'
                    });

            // Launch fancyBox on first element
                setTimeout(function(){$(".fancybox").eq(0).trigger('click');},2000)
                        $.cookie('noShowDonation', true);    
                    });
                }
            });

EDIT # 2 - Обновленный код Используя код, предложенный @Rob ниже, я попытался добавить конфигурации в fancybox, а также время ожидания, однако, не повезло. Здесь JS Fiddle: https://jsfiddle.net/30Lxfc6r/

Ответ 1