rss feed Twitter Page Facebook Page Github Page Stack Over Flow Page

Font resizing with jQuery

Many older or visually impaired users will appreciate you leaving them the ability to change font sizes as they wish without ruining the layout of your site.This Web standard compliance can be easily made using jQuery with minimal coding.

Here's the jQuery Code:

$(document).ready(function() { 
    var size = $('#container').css('font-size'); 
    $("#resetFont").click(function(){ 
        $('#container').css('font-size', size);
        return false; 
    });
    $("#increaseFont").click(function() { 
        var size = $('#container').css('font-size');
        $('#container').css('font-size', parseInt(size)+2); 
        return false;
    });
    $("#decreaseFont").click(function() { 
        var size = $('#container').css('font-size');
        $('#container').css('font-size', parseInt(size)-2); 
        return false;
    }); 
}); 

HTML Code:

<a id="increaseFont">Increase Font</a>
<a id="decreaseFont">Decrease Font</a>
<a id="resetFont"> Reset </a>

<div id="container">
   Here's some text
</div>