jQuery Font Resizer


First, the CSS:

body, a#medium {
font-size:14px;
}
body.small, a#small{
font-size: 10px;
}
body.large, a#large{
font-size: 18px;
}

Second, the JS:

$(function() {
$("a#large").on("click", function (event) {
$("body").removeClass("small");
$("body").addClass("large");
event.preventDefault();
});

$("a#medium").on("click", function(event) {
$("body").removeClass("small");
$("body").removeClass("large");
event.preventDefault();
});

$("a#small").on("click", function(event) {
$("body").addClass("small");
$("body").removeClass("large");
event.preventDefault();
});
});

Third, the HTML:

A
A
A

Check it out