Mobile only slider help

Trying to turn a 3x2 group of tiled images from desktop into a slider horizontal slider on mobile. I dont know how to turn the tiled images from desktop into a slider on mobile without effecting the desktop… i only want the slider mobile. also, the tiled images i made with CSS Grid, and it seems that when I try to delete the grid on mobile it also removes it from the desktop… not sure how to unlink it? img for reference! thanks everyone.

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

anyone have an idea how to get this to work? still trying to figure it out, thanks!

Hi @Jeff_Jodway, welcome to the forums.

You could take this approach. Take the block containing the tiled images and hide it on mobile. Then create a slider and hide it on breakpoints larger than mobile.

Just consider that when an element is hidden, the browser will normal download the assets. So that can create a additional load on mobile clients. So I would consider image sizes and optimization of them to ensure the best possible performance.


That was it! thanks alot, great solution it worked well.

1 Like

podrian mostrar el codigo por favor

I was looking for a solution and figured out an option:

Use Webflow’s slider - and update the mask to flex and wrap for desktop.
You are not able to click and change the mask layer directly… you need to add a new div anywhere, give it the same mask class name and style from there. You can delete that div when done styling and add it back whenever changes are needed.