Jump to content
Search Community

Convert Roblewsky Full Page Slider to GSAP 3

InTheOne test
Moderator Tag

Recommended Posts

Did I hear my name mentioned? :)

 

It's on my list to convert some of these old projects to GSAP 3, but just haven't had a chance yet. The error is because of the gsTransform in the tweenDot() function. You'll want to switch to the new getProperty() method. 

 

function tweenDot() {
  gsap.set(dotAnim, {time:Math.abs(gsap.getProperty(container, "x")/iw) + 1});
}

More info:

https://greensock.com/docs/v3/GSAP/gsap.getProperty()

 

Also remember that ThrowProps is now InertiaPlugin.

https://greensock.com/docs/v3/Plugins/InertiaPlugin

 

Hopefully that helps. Happy tweening.

:)

 

 

  • Like 2
Link to comment
Share on other sites

Hey, the man himself 😁. Thank you, I'm much closer now but:

  1. There is an issue with the dots stagger animation
  2. Sometimes when I swipe right to left and then try to click the left arrow it gets stuck or I click the right arrow and it jumps way back to slide one or two. 

Sorry I thought this would be a little bit easier, this slider is a bit out of my level of expertise. 

Best.

Link to comment
Share on other sites

I made a simpler example to troubleshoot why the drag function is not updating the active slide count:

See the Pen ZEGRRLY by jonroc (@jonroc) on CodePen

function slideAnim(e) {
  oldSlide = activeSlide;
  // dragging the panels
  if (this.id === "dragger") {
    activeSlide = offsets.indexOf(this.endX);
    console.log(activeSlide);
  }

On the old setup the activeSlide variable is getting updated properly but with GSAP3 it always returns -1

Link to comment
Share on other sites

7 minutes ago, InTheOne said:

On the old setup the activeSlide variable is getting updated properly but with GSAP3 it always returns -1

Good catch! This is related to a bug related to endX that has already been fixed in the latest beta: https://s3-us-west-2.amazonaws.com/s.cdpn.io/16327/gsap-latest-beta.min.js

 

I am betting that Craig found it because you asked about converting this slider to GSAP 3 :) 

  • Like 1
  • Haha 1
Link to comment
Share on other sites

1 hour ago, ZachSaucier said:

I am betting that Craig found it because you asked about converting this slider to GSAP 3 :) 

Yep. I discovered that while converting the demos after this thread was started.

 

@InTheOne I should have those conversions done shortly and will post them in my original Full Screen Slider thread. Stand by.

  • Like 2
  • Thanks 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.
×
×
  • Create New...