Wednesday, November 21, 2012

Move UP and DOWN button using jQuery

Scroll up and scroll down buttons for the div tag using jQuery. You need to add jQuery library to your page before use this code sample. It can done by adding this script tag.


Online jQuery library
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js">
</script>

Downloaded jQuery library
<script src="jquery.js"></script>

Monday, November 19, 2012

Dynamic Font resize using jQuery

You can change font size of your entering text when it display somewhere. Element ids, classes and variable names are declared as my app. You can change them as you wish.

var font_size=40;
$("#front_text").keyup(function(){
   $("#preview_text").text($("#front_text").val());
   var front_length = $("#preview_text").text().length;
   if(front_length < 5){
    $("#preview_text").css("font-size",font_size+"px");    
   }else if(front_length >= 5 && front_length < 10){ 
    $("#preview_text").css("font-size",(font_size-10)+"px");
   }else if(front_length >= 10 && front_length < 15){
    $("#preview_text").css("font-size",(font_size-20)+"px");
   }else if(front_length >= 15 && front_length < 20){
    $("#preview_text").css("font-size",(font_size-25)+"px");
   }else{
    $("#preview_text").css("font-size",(font_size-29)+"px");
   }
});​

linkwithin

go