inteltone

I observed the flickering you point to and noticed that it occurs randomly in terms of timeline repetitions, but definitely after a full timeline repetition has occurred — right before button 1 appears. I tried to use the property refreshOnRepeat: true and it seems this makes your animation work much better.

Jack, thanks a lot for your help! Both problems are solved. I really appreciate your quick response and a very detailed explanation.

Hi! I can't figure out how to solve two problems. 1. I use ScrollTrigger to pin top elements of each section during scrolling. Everything is ok until the window width is less than 600px or something. Top elements kind of jump out from their container. 2. If I turn on Draggable then ScrollTrigger works incorrectly at all. It looks like there is a conflict between ScrollTrigger and Draggable. Thanks in advance for your help!

Rodrigo, thanks a lot for your quick response! It is exactly what I looked for. Your help is priceless!

Hi! I am working on a project in which there are two elements: carousel and slider. They are draggable. While dragging any of them their synchronization is ok. But after turning on the inertia property a problem arises. Their synchronization is not that good any more. How to fix that? Thanks in advance for your help!

@GreenSock You are right. I am a beginner so sometimes I can consider things in the wrong way(( Thanks for your help!

I think I solved my problem with the slider. Now the slider works the way I wanted, but the solution in CSS-code itself is not as beautiful as I would like. Just look at the class "box" in the CSS panel. The solution of the problem is based in general on CSS. Still, it seems to me that accounting for gaps between slides should largely be implemented through a function horizontalLoop in JS. https://codepen.io/Valeriy-Medvedev/pen/jOQgbJw?editors=0100 Thanks to everyone who helped me!

@mvaneijgen Please note that the last slide in the row is only partially visible. This is the only problem for me that I can't solve. And I don't think it can be solved with CSS.

@mvaneijgen Thank you for your response. You are absolutely right - it is much more productive and useful to write the code yourself, look at what comes out of it, and so on. But I'm not too advanced in JS programming. I am just learning. This slider example is almost exactly what I need at the moment. I tried to understand its code, but so far it is too complicated for me, so I turned to this forum for help. The only thing that I lack in it is that the slides are shown in full when there are gaps and the last one among visible is not cut off. I think that if such an adjustment was added to horizontalLoop function, then it would only benefit from this. But that's my personal opinion. GSAP is just great! I started working with it and am very satisfied. Many thanks to the creators!

Thanks for your quick response! But is it possible to make all the slides that are visible to be visible in their full width? The last visible slide in your example is shown only partly.

This function that you pointed out to is very helpful indeed! But what about adding gaps between slides? How to do that? And slides have to remain responsive as before. It's a common thing these days these gaps between slides!

@PointC, This function that you pointed out to is very helpful indeed! But what about adding gaps between slides? How to do that? And slides have to remain responsive as before. It's a common thing these days these gaps between slides!