Geek asks and answers

Quoting jQuery font size animation

Currently, I have a line of text whose default font size is 24. I change this to resize to 22:

$(document).ready(function animateHeader() {
$('#random_header').animate({fontSize : "22px"}, 500);
});

I want to cycle this animation back and forth from 24 to 22 and from 22 to 24. How can I do this?

+3
source share
3 answers
$(document).ready(function animateHeader() {
    $('#random_header').animate({
        fontSize: $('#random_header').css('fontSize') == '24px' ? '22px' : '24px'
    }, 500, animateHeader);
});​

http://jsfiddle.net/thirtydot/aDZLy/

+3
source

jsBin demo

$(document).ready(function(){

  function animateHeader(){
    $('#random_header').animate({fontSize : 22}, 500,function(){
      $(this).animate({fontSize : 24}, 500, animateHeader);
    });
  }
  animateHeader();


});
+4
source

to try

function ani(size){
 $('#random_header').animate({fontSize : size+"px"}, 500, function(){ ani((size==22) ? 24 : 22 ); } );
}

ani(24);
+1
source

More articles:


All Articles