Swiper: Mouse Wheel on Windows OS

Created on 28 Jan 2020  路  12Comments  路  Source: nolimits4web/swiper

  • [x] bug
  • [ ] enhancement
  • [ ] feature-discussion (RFC)

cd87ce51fca74b6ddecb5c64618300d59bacc4c4
Windows 10 with Mouse Wheel
https://swiperjs.com/demos/270-mousewheel-control.html

What you did

Use a mouse wheel to scroll through the vertical slides.

Expected Behavior

Initiate a slide next or previous action with similar ease no matter what slide you are on.

Actual Behavior

The sensitivity or threshold in what is required to initialize a next or previous slide action is varied from slide to slide. Some of the slides take a lot more/quicker mousewheel scroll to initiate a slide. This is hardware dependent but seems to be a more extreme problem on Window OS. Some users report that they are unable to slide past the second slide, however they are able to if instructed to "scroll harder"

Most helpful comment

Yes, I've tested it on newest Chrome, Firefox, Edge and Internet Explorer
IE doesn't work at all, some "sign" method error in console, so JS is broken completely, but on other 3 browsers there is same behavior - first scroll is ok, next scroll is not possible, so I can not access 3rd slide with mousewheel

All 12 comments

Yes, I've tested it on newest Chrome, Firefox, Edge and Internet Explorer
IE doesn't work at all, some "sign" method error in console, so JS is broken completely, but on other 3 browsers there is same behavior - first scroll is ok, next scroll is not possible, so I can not access 3rd slide with mousewheel

Just change the version to 4.4.0, that's the problem with the new version.I tried. No problem

浣跨敤4.4.0鐗堟湰灏辨病闂浜嗭紝鎴戣瘯浜唎k

  • [x] bug
  • [ ] enhancement
  • [ ] feature-discussion (RFC)

cd87ce5
Windows 10 with Mouse Wheel
https://swiperjs.com/demos/270-mousewheel-control.html

What you did

Use a mouse wheel to scroll through the vertical slides.

Expected Behavior

Initiate a slide next or previous action with similar ease no matter what slide you are on.

Actual Behavior

The sensitivity or threshold in what is required to initialize a next or previous slide action is varied from slide to slide. Some of the slides take a lot more/quicker mousewheel scroll to initiate a slide. This is hardware dependent but seems to be a more extreme problem on Window OS. Some users report that they are unable to slide past the second slide, however they are able to if instructed to "scroll harder"

As @proactivefly propose, downgrading to 4.4.0 seems to work for me. However, it would be great to solve the issue in the newer versions.

new version 5.3.6 and it is still broken? Come on guys... seriously? :(

EDIT: READ @artkrsk BELOW

Ok, so as I can not wait until next X versions to make it works, I had to investigate it by myself.
So here is my result:
Problem is this whole code block on lines <5107-5119>:

// If there is at least one previous recorded event:
//   If direction has changed or
//   if the scroll is quicker than the previous one:
//     Animate the slider.
// Else (this is the first time the wheel is moved):
//     Animate the slider.
if (prevEvent) {
  if (newEvent.direction !== prevEvent.direction || newEvent.delta > prevEvent.delta) {
    swiper.mousewheel.animateSlider(newEvent);
  }
} else {
  swiper.mousewheel.animateSlider(newEvent);
}

it should be simply replaced with single line of code:

swiper.mousewheel.animateSlider(newEvent);

and mouswheel section scroll now works!

In .min version simply replace:

T?(y.direction!==T.direction||y.delta>T.delta)&&i.mousewheel.animateSlider(y):i.mousewheel.animateSlider(y)

with

i.mousewheel.animateSlider(y)

v 5.3.6
I have the same problem :(

me too :(

It seems the solution proposed by @kubiqsk works good for mouse users on Windows, however it degrades the experience for trackpad users on macOS. The slider may change two times when users is scrolling using fingers on trackpad.

Here is my approach:

if (prevEvent && newEvent.delta < 50) {
  if (newEvent.direction !== prevEvent.direction || newEvent.delta > prevEvent.delta) {
    swiper.mousewheel.animateSlider(newEvent);
  }
} else {
  swiper.mousewheel.animateSlider(newEvent);
}

Works good on both Windows mouse and macOS trackpad.

me too!! Pls help!

if (prevEvent && newEvent.delta < 50) {

This still works not good on macOs.

There is a fix proposed here #3570 Seems like it doesn't break macOs behavior, but does it work better on Windows?

There is a fix proposed here #3570 Seems like it doesn't break macOs behavior, but does it work better on Windows?

A little bit better. At least I can scroll past the second slide =)
But overall still feels very unresponsive, can't move through slides with one continuous scroll.
Changing newEvent.time > prevEvent.time + 500 to newEvent.time > prevEvent.time + 150 helps a little bit, but I don't know about possible side effects.

Also I have this problem in Linux (both Firefox and Chrome), not just windows.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

danielcpereira11 picture danielcpereira11  路  4Comments

QJan84 picture QJan84  路  3Comments

chansecampbell picture chansecampbell  路  3Comments

voodoo6 picture voodoo6  路  3Comments

syedongit picture syedongit  路  3Comments