Zooming with jQuery and CSS.

This is basic level tutorial just changing style using jQuery script. It's simple use it for zooming website content...

Compatible browsers:

Javascript Code:
Contains javascript code. $("#zoom").change(funtion(){}- zoom is the id name of the select box. Using $("#zoom").val(); calling select box value. Applying style at $("#main").css 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript">
$(function()
{

$("#zoom").change(function()
{

var size = $(this).val();
$("#main").css('font-size', size+'px');

return false;
});
});
</script>

HTML Code

Contains HTML code.

Zoom Text:
<select id="zoom">
<option value="25">25 </option>
<option value="50">50 </option>
<option value="75">75 </option>
<option value="100">100 </option>
<option value="150">150 </option>
<option value="200">200 </option>
</select>

<div id="main">
Website Content
</div>

You Can see Demo Version Bellow:

Zoom Text:

25
50

Website Content