jquery-web-multimulta-font-size-changer

The plugin “web multimulta font size chnager” 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. It’s good for building a web accessibility website and also can record user’s selection by cookies. And these are the overview of the advantages to using this plugin:

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.
   • 1em (arround 12px if your default size is 12px)
   • 1.3em (arround 16px)
   • 1.6em (arround 20px)
   • 2em (arround 24px if your default size is 12px)

Updates:

28-07-2014

1. Fixed the display problem which only able to show a part of the icons in IE7 and IE8.
   
2. Add mouserover effect on the icons, if user's mouse arrow move onto the icons, turn into a hand icon.
   
3. Reduce midify javascript file size (to 1.59KB)
   

How to use:

Step 1 )
Import javascript files:

• jquery files
• 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 )
Add 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> 

Demo:

plain text demo:
http://tool.soyosolution.com/jquery-web-multimulta-font-size-changer/demo/allinjs/text.html
Styled demo and introduction page:
http://tool.soyosolution.com/jquery-web-multimulta-font-size-changer/index.html

Reference:

http://en.wikipedia.org/wiki/Web_accessibility http://api.jquery.com/css/ http://www.w3schools.com/js/js_cookies.asp