JustinNobles

I have been trouble setting up Draggable with Angular. I found a stackblitz that worked, with draggable but was an older version as I duplicated the code and it didn't work specifically with imports. I have seen forums saying to put import gsap from "gsap" with gsap.registerPlugin(Draggable); which seems straightforward but when I did that in a simple application using GSAP it doesn't work. Any help would be appreciated! This is the stackblitz where Draggable works with Angular + GSAP that doesn't work with a newer version of GSAP https://stackblitz.com/edit/angular-kyfkfu?file=package.json

I was wondering if it is possible to recreate this project using just scrollTrigger without using the inertia plugin. I basically want to accomplish the same type scrolling functionality when scrolling down on mouse wheel or on mobile like this codepen example I found here in the greensocket docs. I am still very new to gsap and javascript, so I just want a simpler project than the one in the codepen so I can understand everything, but any help would be appreciated!

Awesome, thanks so much!

@ZachSaucier basically but without the scrollbar div moving up

@ZachSaucier Awesome that is so close to what I need! How could I make it where it scrolls all the to the very last div while not fluctuating on the y-axis when scrolled?

@ZachSaucier Interesting, I am assuming the first link you sent me can guide me with that looping images. I know I dropped a couple questions, but I wasn't expecting this fast of a reply haha. At the core of my question, I just want to scroll horizontally with the above code in the demo. I have seen a lot of tutorials, demos, or plugins break if you hide the default scrollbar, but most of the gsap tutorials didn't when the scrollbar was hidden which is awesome. If you could help me build on what I have in the codepen to move the gallery horizontally on mousewheel, I would greatly appreciate it!

@ZachSaucier thanks for the reply and to the css grid loop question yes! That is what I am looking for is where I see the numbers 1 4 and 7 on the right of the last numbers. I have a basic grid example in the demo. My actual grid for my project is way more complex as it has clip paths so I would rather not absolute position things if I had to choose haha

I was wondering if I can horizontally scroll through an image gallery with css grid using scrolltrigger? I would like to scroll using my own custom scrollbar, and or be able to scroll horizontally using the mousewheel through the gallery! Also, if possible have it loop where it goes back when I scroll past the last images back to the first images of the grid that would be a plus! Most importantly let there be no visible default scrollbar shown! I see so many tutorials focusing on flexbox and or 1 page sliders where each child element of the parent div is on another slide, but that won't work as I have my gallery in a 3 x 3 layout instead of a 1 x 9 layout. Also, I have seen tutorials with gsap + scrollmagic but I would rather not use scrollmagic if I don't need to with scrolltrigger. Would love and appreciate the help! I am still pretty new to javascript & GSAP in general, but I have looked through so many tutorials, downloaded plugins, etc. and nothing has really worked for me to the point where I feel like I can move on, especially when I know most of what I am looking for is on websites like this http://www.jeanhelfenstein.com/