search

alvarotrigo / fullPage.js

fullPage plugin by Alvaro Trigo. Create full screen pages fast and simple
http://alvarotrigo.com/fullPage/
GNU General Public License v3.0
35.24k stars 7.3k forks source link

Slide skipping with `scrollingSpeed: 0` in touch devices #2576

Open waissbluth opened 7 years ago

waissbluth commented 7 years ago

Description

When scrollingSpeed is set to 0, horizontal navigation between slides is jumpy and arrows advance two slides with one tap.

Link to isolated reproduction with no external CSS / JS

http://codepen.io/waissbluth/pen/dvbaBj

Steps to reproduce it

  1. Open in a touch device
  2. Change slide with arrows or with touch gestures
  3. Advance two slides with one tap

Versions

Bug is present in iOS Chrome and Chrome touch device emulation at least.

alvarotrigo commented 7 years ago

And don't you have exactly the same issue with the vertical movement?

waissbluth commented 7 years ago

Yes, actually.

alvarotrigo commented 7 years ago

Related with https://github.com/alvarotrigo/fullPage.js/issues/1654, which was never solved. I'll make it as an enhancement in this case. fullPage.js is an scrolling library, so it is not supposed to be used with speed 0 in any case.

The only solution to it might be using a timeout and force the user to wait 600 or 700 milliseconds between slides. But that won't create a great user experience.

waissbluth commented 7 years ago

I see that now. I think that not solving the scrollingSpeed: 0 skipping bug by itself is fine. It was extensively discussed and it seems there is no clear solution.

However, I noticed this problem with autoScrolling: false. That is why I reported the horizontal problem and not the vertical. I isolated the problem and found it to be the scrollingSpeed, but now I realize. Here you can see the problem I am having exactly, where the vertical skipping is not a problem, just the horizontal.

I know this is a scrolling library, but if it have the option of autoScrolling: false, this seems like a valid use case.

alvarotrigo commented 7 years ago

Yeap, but the issue still being the same. Touch events will still be detected after you finish your slide in 0 milliseconds and therefore they'll trigger the movement to another slide.

Some people opt to make use of the Fading Effect extension, which still having a scrollingSpeed time but replacing the scrolling animation for a fading one.

And others they just get rid of horizontal slides in small screen devices using the Responsive Sliders extension.

You might want to consider them.