Streaming live at 10am (PST)

Using the slider as a carousel


#1

Has anyone successfully used the slider to create a carousel that displays more than 1 image per slide? I’m trying to create a carousel that can display 5 or more, say, up, to 10 images per slide for 2 or (many) more slides. Should be straightforward as per instructions at the bottom of https://university.webflow.com/article/sliders on using the slider. But seems not to be the case trying to customize it for a responsive site.

Anyone done this successfully?


Here is my public share link: LINK
(how to access public share link)


#2

Hard to give you an exact answer to your problem without seeing your public share link, but if you set all the slides to say 20% (for five slides) or 10% (for 10 slides) that should work, based on the slider instructions.


#3

You’re right:Hard to help without seeing the work. Regrets. Here’s the link.

https://webflow.com/design/kens-first-project-b3c03b

What you suggests seems intuitive to me also, based on the slider instructions.

Have continued experimenting with it. Seems to work across all but the mobile portrait mode. There must be some detail that I’m not understanding.

Appreciate your help.


#4

That link isn’t working as we are not you, so if you follow the instructions on: https://university.webflow.com/article/sharing-your-sites-read-only-link

We’ll be able to help more! :slight_smile:


#5

Regrets. Try this.
https://preview.webflow.com/preview/kens-first-project-b3c03b?preview=fd41bf7402bb4abcb5f6d75f1012e374

ken williamson
ph 540.435.2808


#6

So what are you trying to accomplish with the slider in mobile portrait? I currently see it showing three items, should there be more showing?


#7

There are 10 images set to auto-play for duration of 5500 ms & timer delay
of 10000 ms, 5/slide on 2 slides, as can be seen plainly in desktop &
tablet views. This arrangement breaks down in mobile portrait & landscape
views.

In mobile landscape it goes to 3 slides: 5 images on slide 1, 5 images on
slide 2 but with the 5th image on slide 1 as the 1st image on slide 2 (so
overlap), & 1 image on slide 3.

In mobile portrait, it goes off the rails as 1 image, the 1st in the
lineup, THE ACCOUNTANT, never displays, and the nav bar is knocked up to be
inline with the slider.

Have configured the css in an array of settings for both mobile displays to
no avail this writing. Revisiting the 33 css videos on styling the 15
videos on css layout & positioning.

ken williamson
ph 540.435.2808


#8

I found part of the problem. The slider’s display was changed from display: block to display: flex which was causing all the elements to bunch up together horizontally. By changing it back to block the slide nav drops to the bottom, and the slides get bigger. The reason that the Accountant slide went missing is that somehow it got toggled to not display in mobile: portrait.

51 PM

So if you click that light grey phone icon while you have slide 1 selected it should return.


#9

Thank you. Much appreciated. All is working now.

How long have you been using webflow?

ken williamson
ph 540.435.2808


#10

Glad I could help.

I’ve been using Webflow on and off since 2015 but got back into it last December.


#11

This topic was automatically closed 125 days after the last reply. New replies are no longer allowed.