Supreme Directory – Splash page that shows only 1 time, checked by JS cookie

Hello guys,

I have a question about saving Javascript Cookies. I made this test page: http://werbederbe.de/musterseite

There you can see a splash page (like a popup) and that popup thing only shows up one time. When you click the X it fades away and you see the page. At the same time a cookie is being in the browser.

So the browser can check if the popup / splash page did show up before or not. If the user has the cookie in his browser then the popup will not show up again.

Now here`s my problem: I get it to work on my test area from the link at the top – but when I try to set it up at my GD page under boz1.timmeserver.de I cant get it to work properly. I can click the X, the splash page / popup disappears but when I enter the URL in the browser again it shows up and seems not to save the cookie – or maybe its saved but the checking fails – i dont know.

I can put the JS code in lots of different places but it never works for some reason…

Usually I add to lines in the HTML head like this:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.cookie/1.4.1/jquery.cookie.min.js"></script>

But then I saw jQuery also works without the first line, too – so I deleted that one and just left the other one to import the cookie stuff.

Normally I wanna make this code here work:

<script>
/* Add Cookie to check if the splash page has been visited  */
$(document).ready(function() {
    if ($.cookie('noShowSplash')) $('#splash').hide();
    else {
        $("#close-splash").click(function() {
            $("#splash").fadeOut(1000);
            $.cookie('noShowSplash', true);    
        });
    }
});
</script>

and this is the div area that i use + some extra CSS:

<div id="splash">
<input type="checkbox" name="hide" id="hide">
<label class="hide" for="hide" id="close-splash">X</label>
<div class="overlay2">
    <div class="overlay">
        <div class="overlay-inner">
            <div class="message">
                <h3>Header</h3> 

                <p>Text</p>
                <!--
                <input type="checkbox" name="hide" id="hide">
                <label class="hide" for="hide" id="close-splash">Weiter zur Seite</label>
                --> 
            </div>
        </div>
    </div>
</div>
</div> <!-- End splash -->

I tried just adding the JS script before the popup / splash DIV, I tried after it, I tried in the HTML head, I tried it at GD – Design – Scripts (tried both in header script and header footer area) now I dont know what else to do so I hope maybe you can help me out with a hint.

Kind regards,
Atilla