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.9k stars 424 forks source link

Vertical slider with fade only shows first slide #1095

Open ehrig opened 1 year ago

ehrig commented 1 year ago

Checks

Version

4.1.4

Description

Splide with direction: ttb and type: fade only shows the first slide. Navigating to the 2nd+ slide does not show the active slide.

Reproduction Link

https://jsfiddle.net/zy7dj0nv/2/

Steps to Reproduce

  1. Set direction to ttb
  2. Set type to fade

Expected Behaviour

2nd+ slide is visible when navigating to it.

Setting the height and heightRatio does not help either.

dkjensen commented 1 year ago

Currently experiencing the same thing on a project I am working on

gmqiyue commented 1 year ago

The issue is located in Fade.ts. The transform is set to translateX and is not configured based on the direction option.

jennlee20 commented 2 weeks ago

Same problem when direction is rtl