Here is my code:
$(function() {
var section = new Array('#content');
section = section.join(',');
var fontcookieoptions = { expires: 10 };
var originalFontSize = $(section).css('font-size');
// call cookie class
$.cookie("test");
// parse cookie into numerical data
var savedFontSize = parseFloat($.cookie("test"),10);
// load cookie value
$(section).css('font-size', savedFontSize);
alert($.cookie("test"));
$(section).css('font-size', $.cookie("test"));
// Reset Font Size
$(".resetFont").click(function(){
$(section).css('font-size', originalFontSize);
$.cookie("test", null, fontcookieoptions);
return false;
});
// Increase Font Size
$(".increaseFont").click(function(){
var currentFontSize = $(section).css('font-size');
var currentFontSizeNum = parseFloat(currentFontSize, 10);
var newFontSize = currentFontSizeNum*1.2;
$(section).css('font-size', newFontSize);
$.cookie("test", newFontSize, fontcookieoptions); // cookie
return false;
});
// Decrease Font Size
$(".decreaseFont").click(function(){
var currentFontSize = $(section).css('font-size');
var currentFontSizeNum = parseFloat(currentFontSize, 10);
var newFontSize = currentFontSizeNum*0.8;
$(section).css('font-size', newFontSize);
$.cookie("test", newFontSize, fontcookieoptions); // cookie
return false;
});
$("#showcookie").click(function() {
alert($.cookie("test"));
return false;
});
});
I have a dynamic font resizer that scales the type size of the main content div up and down. There are three buttons: increase (.increaseFont), decrease (.decreaseFont) and reset to original size (.resetFont). (The alert functions are in there for testing so I can see the value of the cookie.) Currently, there are two issues:
The code fails completely in all IEs. Nothing happens when buttons are clicked, and no value is getting saved to the cookie.
In FF, Opera, Safari, etc., the script works fine but only on the root domain. So it works at example.com and example.com/foo, but NOT example.com/foo/bar
Any help with either issue would be greatly appreciated.