Question

I’m having an issue where i’m trying to use the jQuery plugin by Carhartl : https://github.com/carhartl/jquery-cookie

I thought this would a fairly easy thing to do, but i’m fairly new to jQuery and cookies especially and i’m really struggling now.

What I want to do is:

1. Set a cookie that registers the visit
2. Switch one div for another (in this case, change the sticky bar for a different sticky bar with different content)
3. Keep the new content in place for the returning visitor for x amount of time (if I can specify the exact time, the better)

Current code looks like this:

$(function() {
    if(!$.cookie('repeatVisitor')) {
        $.cookie("repeatVisitor", "true", { expires: 3 }); //expires in 3 days
        setTimeout('showDivTwo();', 3000);    
    }
})

function showDivTwo() {
    $('#sticky-bar').fadeOut();
    $('#sticky-private').fadeIn();
}

I would really appreciate some help, i’m in desperate need!

Answer 1

Your cookie plugin usage looks correct; so does all of your code. I think it may be a logic issue.

Your code will never show the private div after the first time.

You can make this adjustment, but note that if you do, you will ALWAYS see the private div.

What seems to be missing is a specific action that the user needs to take to trigger the cookie, not just the cookie’s lack of existence:

$(function() {
    if(!$.cookie('repeatVisitor')) {
        // if the user is not a repeat visitor, set the cookie
        $.cookie("repeatVisitor", "true", { expires: 3 }); //expires in 3 days
    }

    if ($.cookie('repeatVisitor')) {
        // if the cookie exists, show the custom div
        setTimeout('showDivTwo();', 3000);
    }
})

function showDivTwo() {
    $('#sticky-bar').fadeOut();
    $('#sticky-private').fadeIn();
}