splide icon indicating copy to clipboard operation
splide copied to clipboard

Making a simple splide with 3 images direction ttb causes "Uncaught Error: [splide] height or heightRatio is missing."

Open bertvandepoel opened this issue 3 years ago • 2 comments

Checks

  • [X] Not a duplicate.
  • [X] Not a question, feature request, or anything other than a bug report directly related to Splide. Use Discussions for these topics: https://github.com/Splidejs/splide/discussions

Version

4.1.3 (well, the file says 4.1.2 but it is the latest download)

Description

I'm trying to create a vertical slider that I can style myself, so I was very glad to read about splide. I've however run into a strange issue. A basic example works fine, but once I add direction: 'ttb' as an option, the slider stops working. In my browser console I see the following error: Uncaught Error: [splide] height or heightRatio is missing.

I've seen in previous issues that this is associated with issues that concern display:none. However, I'm not using that CSS property. Perhaps it is caused by the fact that my slides consist of only an image each? I don't specifically mind that I would need to specify a height of some kind, but the documentation does not seem to relay any kind of relation between direction ttb and height, so I thought it would be a good idea to file a bug report to aid in the improvement of this library.

Reproduction Link

http://bert.ulyssis.be/splide_error/

Steps to Reproduce

Simply create a splider with a few images as slides. This will work just fine, then add direction ttb as an option. I've supplied a minimal example like this too.

Expected Behaviour

I expected things to just work, without an error and without the need for a height option (thought to be clear it does work when I specify a height).

bertvandepoel avatar Dec 01 '22 06:12 bertvandepoel

https://splidejs.com/#ttb-heading

As the error log says, TTB requires height or heightRatio and it's by design.

NaotoshiFujita avatar Dec 04 '22 17:12 NaotoshiFujita

I see. I would suggest to also add this to https://splidejs.com/guides/options/#direction as I did not look at examples but used the documentation pages, including the one for options, when writing my code. It's fine for me if it's by design, but then I would expect it to be noted on the official documentation and not just on the main page as part of examples.

bertvandepoel avatar Dec 04 '22 19:12 bertvandepoel