swiper icon indicating copy to clipboard operation
swiper copied to clipboard

Safari using trackpad - swipes two slides using mousewheel module

Open YaroslavShapoval opened this issue 3 years ago • 1 comments

Check that this is really a bug

  • [X] I confirm

Reproduction link

https://swiperjs.com/demos/270-mousewheel-control/core

Bug description

When using Swiper.js with mousewheel plugin enabled in Safari web-browser and with trackpad (not with a mouse), most of the time it swipes two or even more slides after a single scrolling gesture. The problem occurs inside the official demo as well. In my project the same problem exists for horizontal slider, so looks like it's not connected with a direction.

On a video I've attached every time I made a single gesture.

https://user-images.githubusercontent.com/2136103/184926717-31bd4a4b-76c2-438a-9e32-bc0dc66d6feb.mov

Expected Behavior

Swipes one slide after a scroll gesture

Actual Behavior

Swipes two or even three slides after one scroll gesture

Swiper version

Swiper 8.3.2

Platform/Target and Browser Versions

MacOs Safari Version 15.5

Validations

  • [X] Follow our Code of Conduct
  • [X] Read the docs.
  • [X] Check that there isn't already an issue that request the same feature to avoid creating a duplicate.
  • [X] Make sure this is a Swiper issue and not a framework-specific issue

Would you like to open a PR for this bug?

  • [ ] I'm willing to open a PR

YaroslavShapoval avatar Aug 16 '22 16:08 YaroslavShapoval

Also looks like the same bug has been found almost 7 years ago, but was closed due to inactivity - https://github.com/nolimits4web/swiper/issues/1486

YaroslavShapoval avatar Aug 16 '22 16:08 YaroslavShapoval

I'm seeing the same in Chrome (105.0.5195.125) on Mac OS (12.6)

anjin avatar Sep 25 '22 04:09 anjin

+1

senabo avatar Nov 11 '22 10:11 senabo

I have exactly the same issue, the official examples is not working for me either. The bug appears in both chrome/safari...

Hanskrogh avatar Nov 16 '22 10:11 Hanskrogh

you can try set mousewheel.thresholdDelta = 4

like it:

    var mySwiper = new Swiper('.swiper',{
            mousewheel: {
		thresholdDelta:4,
	    },
    })

hellosanbao avatar Feb 15 '23 05:02 hellosanbao

Multiple versions of swiper I've used have this problem, and I haven't found a fix yet, Multiple versions of Swiper I've used have this problem, and I haven't found a fix yet, on safari and chrome for Mac

IisDean avatar Mar 14 '23 02:03 IisDean

你可以试试设置mousewheel.thresholdDelta = 4

喜欢它:

    var mySwiper = new Swiper('.swiper',{
            mousewheel: {
		thresholdDelta:4,
	    },
    })

May I ask if there is no suitable solution in previous versions of swiper5.4.5

IisDean avatar Mar 14 '23 02:03 IisDean

Issue is closed because of outdated/irrelevant/not actual/needed more information/inactivity.

If this issue is still actual and reproducible for latest version of Swiper, please create new issue and fill the issue template correctly:

  • Clearly describe the issue including steps to reproduce when it is a bug.
  • Make sure you fill in the earliest version that you know has the issue.
  • Provide live link or JSFiddle/Codepen or website with issue

nolimits4web avatar Oct 24 '23 12:10 nolimits4web