This is a simple multiple font size jquery plugin, It can change font size of your web content by clicking an icon immediately. The plugin was written by jquery and easy to add to your website. Let have a demonstration of the effect first (Click the button with A below):


And also you can click for the plain text demo here:
http://tool.soyosolution.com/jquery-web-multimulta-font-size-changer/demo/allinjs/text.html

And these are the advantages to using this:

  1. Easy to use
  2. Can record user's selected font size.
  3. Small File's size (up to 2kb only!)
  4. Used the font-size which are always been used in web-design.
    • 12px
    • 14px
    • 16px
    • 20px

You can download the full set of code of this jquery plugin from gitHub:

Soyo Solution

How to use

Step 1)

Import javascript files:

  1. jquery files
  2. soyo-jquery-multi-font-size.min.js (plugin file)
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="soyo-jquery-multi-font-size.js"></script>

Step 2)

Adding the html where you want display the font-size selected box

<div id="font_selection_box"></div>


Step 3)

Add the class "multi-fontszie" where you wanted to change the font-size ( But within the tag with id name font_selection_box ).

<div class="multi-fontszie">
<p>Hey hey! This is text!</p>
</div>

Reference

http://en.wikipedia.org/wiki/Web_accessibility

http://api.jquery.com/css

http://www.w3schools.com/js/js_cookies.asp