Ad Panel Cookie Settings

Question

I have a bar at the top of my site to advertise (for example, how stackoverflow does this with new icons, etc.). The code I use is as follows

HTML

<div id="announcement_popup" title="Special Announcement" style="display:none;"> <h3>Announcement</h3> <a href="#" id="closeit">Close</a> </div> 

JQuery

 $("#announcement_popup").fadeIn("slow"); $("a#closeit").click(function() { $("#announcement_popup").fadeOut("slow"); return false; }); 

Everything works fine, but I would like to be able to set cookies using the jquery cookie plugin, so when the user closes the panel, it will not be displayed again in x number of hours / days. I don’t understand how to do this.

thanks

Answer 1

Say you wanted to hide it for 7 days, it would look like this:

 if(!$.cookie('hideTopBar')) $("#announcement_popup").fadeIn("slow"); $("a#closeit").click(function() { $.cookie('hideTopBar', 'true', { expires: 7 }); $("#announcement_popup").fadeOut("slow"); return false; }); 

Here we check whether the cookie is really set on any non-empty line, if it doesn’t die at all then. In the click handler, we set it to the same 'hideTopBar' cookie for any non-empty strying, 'true' can also be something else ... and using the expires parameter for 7 days.

expires takes several days (it can be a fraction !, for example, 1/24 for an hour), since this is the most common ... if you want a different expiration date, you can also calculate Date and pass it directly.