Any chance to custom swiper slides to hold extra information and still be scrollable?

1

I will like to use the swiper slides but holding more information other than image alone or with text above image… I wonder if it is possible to customise the slides so the slider image can stay on top of the slide and below a bottom area to create an action bar with more information without loosing the swiper slider performance , lazy loading over image and still being able to scroll the slides…

Is it possible to make it happen?
thanks for any tips!

Screenshot 2020-09-08 at 11.15.30
Screenshot 2020-09-08 at 11.15.30654×522 461 KB

2

I need something like that, and solved using scrollable tabs.
The dots in the bottom are the tabs.

Captura de Pantalla 2020-09-08 a la(s) 10.22.50
Captura de Pantalla 2020-09-08 a la(s) 10.22.50652×1258 365 KB

1 Like
3

thanks for the idea but my case I cannot use scrollable tabs but a swiper slider because I have plenty of businesses and I need to scroll horizontal everyone of those let us say between minimum 50-100 stores so the dots of scrollable tabs will not fit in my case to do this!!

But it is a good for the idea for only a pair of tabs on screen! Also my swiper slider will not cover the full screen like in your case but a small part of the screen this is because I have three different swiper sliders on home screen!

thanks for tips anyway! :slight_smile:

4

This is another slider with jquery. https://kenwheeler.github.io/slick/

Give it a look, maybe you can use it.

1 Like
5

Your use case was not that clear… Are you trying to have an image with text and clickable items below it?

Swiper is just the wrapper so you can place regular HTML inside the ‘container’ or ‘Slide’ and use clickevents to trigger actions. Looking at the swiperJS site you can see how the main slider there has links etc in it.

1 Like
6

thanks for the info! but I think I must keep with swiper.js in this case! :slight_smile:
appreciated

7

The slide image in my case does not need to cover the whole slide but the top part of the slide and below a block of text like in the image posted! the bottom part does not swipe in my case! I will try to see what is the problem and make it work someway!
thanks!