Jump to content
Search Community

maisiemay06

Members
  • Posts

    3
  • Joined

  • Last visited

maisiemay06's Achievements

  1. Hi @Rodrigo, Thanks for this, really helpful. I had worked out the issue was something to do with the things not being rendered yet but hadn't found a good way around it. I was looking for a solution like the example given where you can scroll vertically (by using the vertical scroll wheel for example) but the screen would at least appear to scroll horizontally, though. Sorry if this wasn't clear in my initial question. EDIT: After I bit of fiddling... I've forked and altered your pen and managed to get this to kind of work how I want it but also, not really. It appears to scroll horizontally when using the vertical scroll wheel but only when the mouse is over scrollbars (i.e. not on the .image element). I guess this is something to do with the trigger or container but I'm not quite sure how to fix this. I've tried changing trigger to .wrapper, .image and images but no luck. Also, the snap function isn't working quite right and is skipping over section 2 and not lining up correctly. Haven't looked into fixing that properly yet. https://codepen.io/maisiemay06/pen/rNvKBvd
  2. I'm very new to GSAP and trying to practice with a very simple horizontal scroll. I've been using this example as a guide with a few changes to make it work with Nuxt3/composition API. https://codepen.io/GreenSock/pen/YzygYvM I'm also working with Tailwind but this isn't working the the CodePen, so I've included the style section too. In my actual app, the site isn't scrolling horizontally and just scrolls down a very tiny amount (like half of the one) and that's it. How do I get it to scroll horizontally? The example has a vertical scrollbar but mine only has horizontal? Have I missed something here? I've recorded my screen to show you what's actually going on on my screen because the CodePen doesn't seem to be representing this in the same way. Video in link below: https://drive.google.com/file/d/1iB5rQiR58bd0EjQyoXuwC-sUAb6Y1Sii/view?usp=sharing Thanks in advance for any help!
×
×
  • Create New...