CODEWITHSUNDEEP
jquerycookiessession-cookies
Thomas
Thomas

Reputation: 589

Show div on second visit

I want to have the div #topmessage slide down on the users second visit to the site. Also when the user clicks the #close the message will not be shown again. I guess I have to set a cookie and count it but not sure how. I have the following cookie plugin installed together with jquery http://plugins.jquery.com/files/jquery.cookie.js.txt

    <script type="text/javascript">
    jQuery(function($){ 
    $('#topmessage').delay(1000).slideDown(400);
    $("#close").click(function(){
          $("#topmessage").slideToggle(400);
        });

});
</script>
<div id="topmessage">
<a href="#" class="close" id="close">Close</a>
Hi welcome back, if you have any questions please feel free to <a href="/contact">contact me</a>.
</div>

Update: The reason I want to do this is to push the div to users who have visited the site once and are now returning on another date. I don’t just want to show the div the second time the site is loaded, but it has to be on another date or session as well. As far as I can see there is no way to access the creation date of a cookie?

Upvotes: 3

Views: 2333

Answers (4)

roberkules
roberkules

Reputation: 6605

This should work:

<script type="text/javascript">
    $(function(){
        var value = $.cookie('the_cookie'),
            date = null;
        if (/^\d+$/.test(value || "")) {
             date = new Date();
             date.setTime(value);
        } else if ((value || "") == "") {
             $.cookie('the_cookie', new Date().getTime());
        }

        if (null != date /* && date meets your requirements */){
            $('#topmessage').delay(1000).slideDown(400);
            $("#close").click(function(){
                $("#topmessage").slideToggle(400);
            });
        }
    });
</script>

If you want to update the date in the cookie at each visit:

        if (/^\d+$/.test(value || "")) {
             date = new Date();
             date.setTime(value);
        }
        $.cookie('the_cookie', new Date().getTime());

Working demo at: http://jsfiddle.net/roberkules/NL9jd/

UPDATE

added expiration date and path to cookie
added 2nd cookie just for the session

Upvotes: 5

Thomas Shields
Thomas Shields

Reputation: 8943

Probably (haven't used Jquery cookie but looking at the doc...) do... 

jQuery(function($){ 
    if($.cookie("showMessage") == "true") {
    $('#topmessage').delay(1000).slideDown(400);
$.cookie("showMessage","never");
}
else if($.cookie("showMessage") != "never"){
$.cookie("showMessage","true");
}
    $("#close").click(function(){
          $("#topmessage").slideToggle(400);
$.cookie("showMessage","never");
        });

Upvotes: 1

AlbertVo
AlbertVo

Reputation: 772

First you need to detect if a cookie exists. If the cookie exists, then you know the user has already visited once. If the cookie does not exist, its the first visit, create the cookie.

Upvotes: 0

CtrlDot
CtrlDot

Reputation: 2513

I would think something like this should be stored in the backend and controlled by the server. The problem with cookies is that someone could delete all of their cookies (or log in via a different browser/computer). Sounds like a property on a database table relating to the user.

The server could simple set a flag to "show div" and the view could take care of that. Not sure what sever side technology you are using.

Upvotes: 1

Related Questions