Jump to content

Search In
  • More options...
Find results that contain...
Find results in...

GSAP timeline over element

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

im try to fire timeline when a li it's hover, so i create a var with my timeline, and with event.delegateTarget to find children and not all with .CLASS

this is my code

$(".gb-help-list ").on('mouseover', 'li', function (e) {
	var tl = new TimelineLite();
		 	tl.to($(event.delegateTarget).find('.line-help'), 2, {width: '100px', ease: Power4.easeOut})
			.to(".line-help", 2, {width: '100%', ease: Power4.easeOut}, "-=1");

}).on('mouseout', 'img', function (e) {
    TweenLite.to($(e.delegateTarget).find('span'), 1.5, {opacity:0});

I don't see any error in console, but this : o($(event.delegateTarget).find('.line-help'), 2, {width: '100px', ease: Power4.easeOut} doesn't fire....

anyone can helpme?

Thx in advance


Link to comment
Share on other sites

Hi and welcome to the GreenSock forums,


It would be great if you could provide a very simple CodePen demo for us to test.



I'm not terribly familiar with using event.delegateTarget so it would really help to see it all in a working environment.


Perhaps you can get some ideas from:



  • Like 1
Link to comment
Share on other sites

Hi carl!


Thanks for the warm welcome.

your examples are perfect for my task.



  • Like 1
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.