Jump to content
GreenSock

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

Search the Community

Showing results for tags '$(this)'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • GreenSock Forums
    • GSAP
    • Banner Animation
    • Jobs & Freelance
  • Flash / ActionScript Archive
    • GSAP (Flash)
    • Loading (Flash)
    • TransformManager (Flash)

Product Groups

  • Club GreenSock
  • TransformManager

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests

Found 1 result

  1. Hi there, I am integrating GSAP with fullpageJS. for some slides, i am using the same timeline for the elements to fade in when a user gets on a new slide. This is how i set my animation var workTitle = $(".title"); var workContent = $("p"); var content = [workTitle, workContent]; var tl2 = new TimelineLite({}); tl2.staggerTo( content, 0.2, { autoAlpha: 1, opacity: 1, ease: Power1.easeIn },0.2); for now the animation will run for all slides when the user gets to a slide. for example if the user gets on slide 1, the content fades in. but when I swipe to slide 2, the content is already in view because the animation was played for all slides. this is how all my slides (will) look like. <div id="slide2" class="slide"> <section class="content"> <h3 class="title">slide 2</h3> <p> content </p> </section> </div> I am using the callbacks provided by FullpageJS in combination with GSAP. I know $(this) refers to the specific element you want to target, but I can't seems to find a way to refer to $(this) in a timeline. Its working fine except the animation is triggered for all slides, which needs to be only for the loaded slide. see how i make use of the callback provided by fullpage with some gsap. afterSlideLoad: function(anchorLink, index, slideAnchor, slideIndex) { var workTitle = $(".title"); var workContent = $("p"); var content = [workTitle, workContent]; var loadedSlide = $(this); var tl2 = new TimelineLite({}); tl2.staggerTo( content, 0.2, { autoAlpha: 1, opacity: 1, ease: Power1.easeIn }, 0.2 ); if (index == 2 && slideIndex == 1) { tl2.play(); } if (index == 2 && slideIndex == 2) { tl2.play(); } } Can someone help me and put me on the right track please see my fiddle: https://jsfiddle.net/jqk753m7/5/
×