Learn free online HTML5, javascript, and jquery Tutorials by Examples

Sunday 1 June 2014

Increase font size using jQuery

----------------------------------------------

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

$("#zoom_in").change(function(){
var size = $(this).val();

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

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

<div style="border-bottom:solid 3px #FF9D9D; padding:5px;">
zoom Text: <select id="zoom_in">

<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>
<div id="main">satiah mallick</div>

<style>
#main{margin:10px;font-size:25px;}
#zoom_in{font-size:15px;}
</style>

----------------------------------------------

No comments:

Post a Comment