Jump to content


jQurery .stop in greensock

Recommended Posts



Again i have a problem and i need help.


I have written a code to animate svg on hover and it does so also but the problem is when i quickly hover again and again it redraws and looks broken i looked in jquery they have something .stop(true, false) with .animate but which cant be used as i am using greensock and it works differently so i tried with pause but its just pauses the animation.


I have looked in forum and found this but i am not sure how can i +=20 with SVG



I hope i have created a proper codepen this time.




See the Pen gaKjwp by osricmacon (@osricmacon) on CodePen

Link to comment
Share on other sites

Hi Fahim  :)


that's better to generate tween or timeline out of the hover functions and just play/reverse ( or whatever ) with hover .


pls check this thread : http://greensock.com/forums/topic/12737-opacity-on-hover/


something like this : 

$(".items").each(function(index, element){
  var tl = new TimelineLite({paused:true});
  // add your timeline tweens here
  element.animation = tl;
$(".items").hover(over, out);
function over(){ this.animation.play() };
function out(){ this.animation.reverse() };
  • Like 2
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.