Share Posted November 5, 2022 Hello, Is there a nice slider like this with different direction? I need all the boxes to be aligned to right and move to right when a click next arrow. Thanks! See the Pen gOvvJee?editors=0010 by GreenSock (@GreenSock) on CodePen Link to comment Share on other sites More sharing options...
Share Posted November 5, 2022 Hi, You should check the demos of the horizontal endless loop helper function created by @GreenSock: https://greensock.com/docs/v3/HelperFunctions#loop Hopefully that's enough to get you started. Let us know if you have more questions. Happy Tweening! Link to comment Share on other sites More sharing options...
Share Posted November 5, 2022 10 hours ago, Catalin R. said: Is there a nice slider like this with different direction? I need all the boxes to be aligned to right and move to right when a click next arrow. I read that a few times and I'm still lost, sorry. All boxes "aligned right and move right"? So they're all on top of each other with their right edges touching? A minimal demo would really help. The one you provided looks like it's already using the helper function that @Rodrigo suggested. Maybe you're just describing inverting the next/prev buttons? Link to comment Share on other sites More sharing options...
Author Share Posted November 6, 2022 Hi @Rodrigo, I need all boxes to be aligned with flex-direction: row-reverse and aligned to right not to center or left. After that, when I click the next arrow all the boxes move to right not to left. Like here: See the Pen VwdKyBp by ZenTao (@ZenTao) on CodePen Thanks! Link to comment Share on other sites More sharing options...
Share Posted November 7, 2022 Hi, Honestly I don't know if that is feasible with the current setup of the Loop helper function. I tried tinkering with it because basically you need to invert everything. Unfortunately is not as simple as changing the flex direction of the parent container and be done with it, as you already found out , and I don't have enough time to go through the helper function, revert everything and test (even if that is the way to solve it). I'll ping @GreenSock so He can clarify if this is possible and how it could be achieved with the changes you want to make to the setup. Please stand by for a more official explanation. 1 Link to comment Share on other sites More sharing options...
Author Share Posted November 7, 2022 Hi @Rodrigo, I thank you for your availability! I know that the slider doesn't work if I change the flex direction, and I've tried to make some changes into Loop helper function but it's not so easy, I need more time for that! But I've made something interesting! I linked this slider to a container that contains descriptions for each slide! It works nice! See attachments, please! Link to comment Share on other sites More sharing options...
Share Posted November 7, 2022 3 hours ago, Rodrigo said: I'll ping @GreenSock so He can clarify if this is possible and how it could be achieved with the changes you want to make to the setup. Anything is possible, but it'd take quite some time to figure it all out and unfortunately we just can't do that all for free. Sorry. If you'd like to hire us to figure out all the customizations necessary, just contact us privately and we can discuss pricing. 👍 1 Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now