CODEWITHSUNDEEP
jqueryhtmlcookies
Jacinto
Jacinto

Reputation: 556

Jquery Cookie Read and Set

I am trying to have it look to see if the cookie exists and if not fade in. Then if the user clicks the close button it fades out. What am I doing wrong?

Jquery

$(function() {
    if ($.cookie("demoCookie") == null) {
        $("#headerFactInfo").fadeIn();
    };

    $("#headerFactInfoClose").click(function() {
        $("#headerFactInfo").fadeOut();
        $.cookie( 'demoCookie', '1',  { expires: 7, path: '/' } );  
    });
});

Html

<div id="headerFactInfo">The Great Add <a href="" id="headerFactInfoClose" >Close</a></div>

Upvotes: 0

Views: 336

Answers (2)

Ayman Safadi
Ayman Safadi

Reputation: 11552

Your code seems to work fine: http://jsfiddle.net/wPP6Y/

I made only 2 modifications:

CSS

/* It's hard to tell whether it's fading in
 * or not if it's always visible
 */
#headerFactInfo {
    display: none;
}

JS

$("#headerFactInfoClose").click(function() {
    $("#headerFactInfo").fadeOut();
    $.cookie( 'demoCookie', '1',  { expires: 7, path: '/' } );

    return false; // Prevent the link to actually follow the href
});

Use Firebug for Firefox or Chrome's developer tools, or your favorite browser's equivalent to play around with the cookie.

Upvotes: 1

Sudhir Bastakoti
Sudhir Bastakoti

Reputation: 100195

If you mean, cookie check is not working then, try:


$(function() {
     var Cooki = $.cookie('demoCookie');

    if (Cooki == null) {
        $("#headerFactInfo").fadeIn();
    }

    $("#headerFactInfoClose").click(function() {
        $("#headerFactInfo").fadeOut();
        $.cookie( 'demoCookie', '1',  { expires: 7, path: '/' } );  
    });
});

Upvotes: 0

Related Questions