1 Question:
If you quickly scroll the screen on a mobile device and then click to stop the scrolling, how can you avoid accidentally touching the a tag and jumping to other pages when clicking?
2 This is also a problem actually encountered in the front-end development of mobile terminals. To be more specific, under normal circumstances, when our current page has a lot of content, is high in height, and scroll bars appear, when we Swipe the screen with your hand, and the page content on the screen will scroll quickly, and the scrolling will not stop because your hand has left the screen. At this time, when we want to stop scrolling, we also tap the screen lightly to stop the screen. But there is a problem at this time. If there happens to be an a label or a button at the clicked position on the screen, it will be easy to enter the next route at this time. I checked some instructions on the scroll event on mdn, but there is no explanation on the speed of the scroll process and the reaction time of stopping.
My idea is to first determine whether the scrolling event has stopped. When it stops, then give a certain time delay before subsequent clicks are effective. In this case, after rapid scrolling, click the screen for the first time to stop the scrolling, and click the screen for the second time. If you click on an a label, you can jump to other routes. How should this be achieved?
Are your product requirements so demanding? I feel that this should not be a problem. It should follow such physical logic. I have never seen any product that circumvents this logic. If you have to solve it, your idea is feasible. In that case, you need to proxy all links or elements with click behavior. Personally, I think it is an approach that is not worth the gain.
Just set a state value. For example, when you scroll, the state value isScrolling = true; when the scrolling is completed or stopped by clicking, set isScrolling = false. Event triggering can only be effective when isScrolling= false.
I have also dealt with the same problem
Distinguish between click events and replace click events with touch
Calculate the duration of the click and the distance to determine whether the click event is triggered
If it’s not clear yet, I’ll give you a demo later