JQuery cookies + animation, DIVS, and wordpress

1 Views

I’ve got the following setup which is working well, except for the cookies part. The JQuery is controlled by the following script: 

$(document).ready(function () {
    $("#headershadow").hide();
    $("#greenbanner").show();
    $("#bigx").click(function () {
        $("#greenbanner").hide(1000);
        $("#headershadow").show(500);
        $.cookie('greencookie', 'true', {
            expires: 1,
            path: '/'
        });
    });
});

This is the HTML:

Read More
    <img src="<?php bloginfo('template_directory'); ?>/HeaderShadow.png" id="headershadow" />
    <div id="greenbanner">
        <img src="<?php bloginfo('template_directory'); ?>/Devices.png" id="devices">
        <img src="<?php bloginfo('template_directory'); ?>/bigx.png" id="bigx">
        <div id="bannertext">Spundge lets you discover, <br />curate, and create better content. <br /><br /><div id="jointhedarkside"><a style="color:#ffffff;" href="https://www.spundge.com/account/signup/">Get Started - It's Free</a></div>   </div>
    </div>

I’m using the following cookies JQuery plugin from GitHub, and I seem to be able to set the cookies properly, but I have no idea how to setup the code so that the web page recognizes the cookie and doesn’t load the #greenbanner div. All the if/else combinations I’ve tried have been useless.

Please help!

Post Views: 1

Related posts

Leave a Reply

1 comment

  1. Tell me if it work for you: 

    $(document).ready(function () {
    $("#headershadow").hide();
    if (!$.cookie('greencookie')){
        $("#greenbanner").show();
    }
    $("#bigx").click(function () {
        $("#greenbanner").hide(1000);
        $("#headershadow").show(500);
        $.cookie('greencookie', 'true', {
            expires: 1,
            path: '/'
        });
    });
});

    If its ok I will add a brief explanation about what I did.