Ceejay
Ceejay

Reputation: 7267

How to start another animation on end of one animation in velocityjs

i am trying to animate the image using velocityjs. here i am trying to get the sparkling effect for one of the image.the image first scales up and then it turns opacity to zero.

Here i am calling the anim1 first and then after the anim1 i want to call anim2 how can i do that?

        var anim1 = function(){
            $(".sparkle1").velocity({ 
              opacity: 1,
              scale: [1,0],
            }, 300);
        }  

        var anim2 = function(){
            $(".sparkle1").velocity({ 
              opacity: 0,
            }, 200);
        }

Upvotes: 1

Views: 31

Answers (1)

vijayP
vijayP

Reputation: 11502

Could you please try to use complete callback as follows:

var anim1 = function(){
    $(".sparkle1").velocity({ 
          opacity: 1,
          scale: [1,0],
        }, {
        duration:300,
        complete: function() {
            anim2(); //calling the second animation on completion of first
        }
    });
 }  

var anim2 = function(){
    $(".sparkle1").velocity({ 
      opacity: 0,
    }, 200);
}

Upvotes: 1

Related Questions