Cookies change when I navigate to another page (Using jquery cookie)

Question

For example, the user can change the font size, and it is remembered in the cookies. Say I am on the product page and change the font size there and add the cookie. Everything looks fine, but when I go to the front page, the font size is back to normal. Going back to the product page, the cookie is applied. How can I make the cookies work site-wide instead of per page? Or is there something wrong with what I am doing?

How I do it is, when the user checks a checkbox:

$.cookie('font', 'x2');

And on $(document).ready() I simply check the cookie and apply the css so:

if($.cookie('font') == 'x2') {
  $(body).css('font-size', '200%');
}

Or something like that. I don't think the problem is in my code though anyway, since it works, is this some kind of Drupal behaviour or...?

Answer 1

Not really Drupal related, but it sounds to me like you are only setting the cookie for the current path.

Change:

$.cookie('font', 'x2');

to:

$.cookie('font', 'x2', { path: Drupal.settings.basePath });

Answer 2

Set a timeout of a certain number of days on the cookie:

$.cookie('font', 'x2', { expires : 10 });