Directory

← Back

Splide Addon

Vaadin addon that displays images and videos as a carousel

Author

Rating

Popularity

700+

This addon is based on Splide library.

Splide component allows to create a carousel/slider to display images and videos (youtube, vimeo or html) including a thumbnail control and full screen functionality.

Major pieces of development of this add-on has been sponsored by customers of Vaadin. Read more about Expert on Demand at: Support and Pricing

Sample code

    ImageSlide slide1 = new ImageSlide("images/slide_1.jpg");
    ImageSlide slide2 = new ImageSlide("images/slide_2.png");
    ImageSlide slide3 = new ImageSlide("https://source.unsplash.com/random/1000x1000?sig=3");
    Splide slider = new Splide(Arrays.asList(slide1, slide2, slide3));
    slider.setId("images-slider-demo");
    slider.setWidth("450px");
    slider.setHeight("300px");
    slider.getElement().getStyle().set("margin", "auto");

Compatibility

(Loading compatibility data...)

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

Bug fixes:

  • add timeout to avoid wrong container height display
Released
2023-03-08
Maturity
TESTED
License
Apache License 2.0

Compatibility

Framework
Vaadin 14
Vaadin 15
Vaadin 16
Vaadin 17
Vaadin 18
Vaadin 19
Vaadin 20
Vaadin 21
Vaadin 22
Vaadin 23
Vaadin 24
Browser
Firefox
Google Chrome
Microsoft Edge

Splide Addon - Vaadin Add-on Directory

Vaadin addon that displays images and videos as a carousel Splide Addon - Vaadin Add-on Directory
This addon is based on [Splide](https://github.com/Splidejs/splide) library. Splide component allows to create a carousel/slider to display images and videos (youtube, vimeo or html) including a thumbnail control and full screen functionality. ### Sponsored development Major pieces of development of this add-on has been sponsored by customers of Vaadin. Read more about Expert on Demand at: [Support](https://vaadin.com/support) and [Pricing](https://vaadin.com/pricing)
Online