Jquery Animate Method

These are used to create animation in the HTML elements.

Jquery animate()
$(document).ready(function(){
  $('button').click(function(){
    $('div').animate({
      left: '250px',
      opacity: '0.5',
      height: '100px',
      width: '100px'
    });
  });
}); 


Jquery animate() - Queue Functionality
$(document).ready(function(){
  $('button').click(function(){
    $('div').animate({
      height: '300px',
      opacity: '0.5'
    }, 'slow');
    $('div').animate({
      width: '500px',
      opacity: '0.7'
    }, "slow");
    $('div').animate({
      height: '100px',
      opacity: '0.5'
    }, "slow");
    $('div').animate({
      height: '200px',
      opacity: '0.7'
    }, "slow");
  });
}); 

Share this

Related Posts