[sticky section horizontal scrolling]

Hi @Jack,

 

YES!!! Thank you!! You rock!!

[sticky section horizontal scrolling]

Hi @Cassie,

 

Thank you for your reply. In this example, the sections are full screen width & height. In my example, there is a sticky title and scrollable cards. 

[sticky section horizontal scrolling]

Hello,

 

I am trying to have a sticky section with title and below some cards.  When i scroll the cards should move.  (http://horizontal-scrolling-sticky-section.webflow.io/). Can you help me?

 

I saw this post but with no answers.

 

I think this could be useful for other noobs like me.

 

 

Thank you

 

 

 

See the Pen abJvbEq by mvp0409 (@mvp0409) on CodePen

[ScrollTrigger horizontal animation stop tween]

Hi,

 

I've managed to do it.

On the ScrollTrigger for horizontal sections, i am checking the progress with onUpdate, and if it's at a certain point i am showing the button animation and on more scroll (bigger progress) i snap to next section.

 

 

Thank you!

[ScrollTrigger horizontal animation stop tween]

Hi Jack,

 

I will try to reformulate. So i have 2 horizontal panels and then one vertical panel. I would like if possible after the scroll on horizontal panel ends, to trigger an animation so the second panel of horizontal displays a "next button". After this animation is finished, i would like after the next scroll to snap to the next vertical panel / or when the user clicks the button.

 

On reverse, it can skips this, and just reverse the page normal. 

 

Then I have to click a button to get the scrollbar back and continue? Am I understanding that correctly? : Click a button or continue scrolling.

 

 

And what happens when I scroll back up? I can go as far as I want? But then on the way back down I keep getting stopped?  Just the first time i think, it or it can repeat again.

 

Regarding the scrollbar, it can just show that there are 2 sections, and then it will increase it's length.

 

So what I want is after the horizontal panel ends to trigger an animation and make sure that the user see that animation, and doesn't skip forward it with a super fast scroll. 

 

I have updated my codepen to have 2 horizontal sections and one vertical.

 

Thank you!

[ScrollTrigger horizontal animation stop tween]

Hello guys,

 

After seeing some GSAP sites and what it can achieve, i’ve decided that it’s time to add more interaction on websites and level up my animation process.

 

So… i’ve joined the GSAP “club”!

 

I’ve started by watching some tutorials, read some forum posts and some documentation. BTW: great community!

 

With a little effort i’ve managed to create my desired animations,  but unfortunately i can’t figure this one out :(.

 

My intention is:

- scroll vertical until section 2 ends and then stop the user scrolling

- a button should appear and notice him that this section is finished.

- when he clicks the button / scroll down he will be moved (snapped) to the next section. (so he will be aware that he will go to a new section and won’t scroll fast through website skipping this detail).

- when he scrolls down another time on section 3, again a button should be shown and after next scroll to snap to the next section.

 

Codepen:

 

So what i am trying to achieve is basically an intercept on  tween ends, stop the scroll, notice the user that the section is down, and after the animation is done, the user can scroll again and he will be snapped to next section.

 

 

Thanks in advance!

 

See the Pen PoWyxgK by mvp0409 (@mvp0409) on CodePen