[Pinned element on scroll related to another pin element]

Maybe the expected result wasn't clear, So when we are inside a new category (when the left element change the title) I want the right list to be pinned for exemple 300px. As You can see inside my codepen I have a scrolltrigger that for me should do the trick but when I uncomment it, it make the right list shakky when touch the top and it doesn't pinned well. Any idea to make this work as intended ?

[Pinned element on scroll related to another pin element]

Hello Everyone, I'm trying to pin right section when It touch the top of viewport but when I try by using another Scrolltrigger it make things a bit shaky and break the other effect.

See the Pen NWMKgPL by beatlesbob (@beatlesbob) on CodePen

[ScrollTrigger Horizontal doesn't do his thing in mobile]

13 minutes ago, akapowl said:

 

Hello @BeatlesBOB

 

Try setting overflow-x to hidden on your .wrapper - that overflow is probably what's causing the whole layout to shift in that view. It does fix it for me - is that better for you, too?

 

Edit: I suppose you are talking about the dev-tools opening on press of F12 (Chrome on Windows does that) and the mobile view of the dev-tools accordingly-.

 

.wrapper{
  display: flex;
  flex-wrap: nowrap;
  overflow-x: hidden;
}

 

Hi, thank you for your reply, Yhea it totally do the job, thank you very much, and I was talking about dev tools, sorry for my poor explanation. @Cassie

[ScrollTrigger Horizontal doesn't do his thing in mobile]

Hello, I'm trying to make a Timeline using scrolltrigger, I'm quite new to gsap and developpement.
The thing works quite fine but on mobile, when I press f12 the scrolltrigger doesn't pin and animate.
 

Have you  any idea to solve this ?

See the Pen LYjWwxG by beatlesbob (@beatlesbob) on CodePen

[ScrollTrigger Horizontal doesn't do his thing in mobile]

Hi, I'm trying to do something like this in a page.

Actually on the codepen everything work, but on actual full page using juste html css and javascript, when I passed to mobile overview scrolltrigger doesn't seems to work

See the Pen mdMbxgq by beatlesbob (@beatlesbob) on CodePen

[ScrollTrigger Horizontal with animation]

Yea fore sure : .

To replicate my issue, just put an markers : true and it will scroll again

[ScrollTrigger Horizontal with animation]

I'm really sorry for my English, I wanted to say that when I pass the markers to : true, I could scroll again in the different sections. And  section.clientHeight return me the current height of my section

[ScrollTrigger Horizontal with animation]

Hi @Cassie thank you very much for your reply, I'm sur it will help now or later. I'm actually struggling on even more basic thing since I'm discovering Gsap.

Like in the codepen sample when I remove markers nothing happen it's like markers unlock the scroll.

To do the expect effect i was using like Intersection observer but I'm sur we can know current section using only Gsap witch I'm sure it's more relevant. 

[ScrollTrigger Horizontal with animation]

Hi everyone, I'm trying to make an horizontal scroll, that I understand. I'm not very good at math and logic but I want to make like when u scroll the scale of the section goes .5 then back to normal.

 

I have seen plenty of exemple but i cannot figure what logic is behind.

Sorry for my english.

See the Pen eYWMrEW by beatlesbob (@beatlesbob) on CodePen