Splidejs / splide

Splide is a lightweight, flexible and accessible slider/carousel written in TypeScript. No dependencies, no Lighthouse errors.
https://splidejs.com
MIT License
4.89k stars 424 forks source link

Placing a slider inside a container with a transform: rotate breaks the autoscroll #1157

Open wplit opened 1 year ago

wplit commented 1 year ago

Checks

Version

v4.1.4

Description

With the autoscroll feature - if the slider itself or a container is rotated, the autoscroll speed keeps changing overtime. Going very fast or slow, and then accelerating and deaccelerating as the slider reaches different slides.

Reproduction Link

https://codepen.io/wplit/pen/rNqjKwO

Steps to Reproduce

Setup autoscroll as per the steps in the docs.

Add transform:rotate(6deg) to the slider or any container of it.

Note that positive deg rotation speeds up the slider, negative slows it down.

In both situations the speed isn't consistent, so it's not like we can just adjust the speed option to account for it. It's accelerating and deaccelerating and it moves.

Expected Behaviour

The speed would be the same as if there were no rotation.

richi-coder commented 5 months ago

Hi, I am experincing exactly the same issue..