Jump to content
Search Community

Touch input/touch simulation breaks horizontal scrolling

Sooova test
Moderator Tag

Go to solution Solved by OSUblake,

Recommended Posts

Hey all,

 

I've recently dabbled with making a mock website using horizontal scrolling of GSAP, and i've encountered a problem which i'm unsure why is occuring. The site works perfectly on desktop, and even at the same resolutions as mobile when touch input is disabled, but when it is enabled the horizontal scroll breaks as well as some other things such as AOS which also breaks. I'm unsure why it occurs. Putting it up on code-pen doesn't show the problem, however the github repo below has a live github pages link and the code can be seen there as well:

https://github.com/Sooova/Validus-Studios-Concept

the github pages link is here:

https://sooova.github.io/Validus-Studios-Concept/

if someone could help me out i would be so greatfull!!!!!

See the Pen PoOKyMJ by sooova (@sooova) on CodePen

Link to comment
Share on other sites

hey thanks for the reply @OSUblake. Yeah i've already tried putting that, it just wasn't deployed yet!!! I'm really baffled. I've re-edited the intial post and added a code-pen, but i don't think you can see the problem in code-pen, only when on dev-tools response with touch enabled, or on a mobile device.

Link to comment
Share on other sites

@OSUblakeHey, i wholeheartadly take my statement back! You were absolutely correct. One thing i failed to take into account, is that on mobile devices, overflow-X:Hidden is ignored if it is in the body tag. I just wrapped everything over a main div and applied it to that instead. thank you so much for your help!

  • Like 3
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...