Saltar navegación

[Resuelto] Responsive Carousel with fewer shown slides on mobile vs desktop

Este hilo está resuelto. Aquí tiene una descripción del problema y la solución.

Problem:
Responsive Carousel with fewer shown slides on mobile vs desktop

Solution:
You can display different number of slides per screen by creating multiple views. In this case, one view with three slides and another view with one slide and add both views to your place where you want to display it and then use CSS media queries to hide and show the sliders depending on the screen resolution.

Relevant Documentation:
=> https://www.w3schools.com/cssref/css3_pr_mediaquery.asp

This support ticket is created 4 years, 6 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
- 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 -
- 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 -

Zona horaria del colaborador: Asia/Kolkata (GMT+05:30)

Este tema contiene 2 respuestas, tiene 2 mensajes.

Última actualización por Ronald 4 years, 6 months ago.

Asistido por: Minesh.

Autor
Mensajes
#2244583

Tell us what you are trying to do?
I have a carousel using the Toolset Views slider settings, and I would like it to go from three viewed slides at a time to only one on mobile. Is there a way to do this?

Is there any documentation that you are following?
No

Is there a similar example that we can see?
Unsure

What is the link to your site?
enlace oculto

#2244859

Minesh
Colaborador

Idiomas: Inglés (English )

Zona horaria: Asia/Kolkata (GMT+05:30)

Hello. Thank you for contacting the Toolset support.

There is no such way to set different number of slides per screen.

But the workaround would be is to use two separate sliders views, one view with three slides and another view with one slide and add both views to your place where you want to display it and then use CSS media queries to hide and show the sliders depending on the screen resolution.

More info:
=> enlace oculto

#2245297

Yes, I figured that workaround shortly after I made this post. I was hoping there was something more elegant as a solution, but this will work for now.