Community forum for knowledge and support

Updated 11 months ago

Designing A Slider Element With Only Images

At a glance

A community member is looking for help designing a slider element using the Relume Framework and Webflow's native slider, where 3 image elements are visible across the screen, with the central image fully visible and the other two images partially visible. The community member needs a solution by the following Sunday.

In the comments, another community member suggests checking YouTube for Webflow slider tutorials, as well as using more advanced slider libraries like Finsweet CMS Slider, SplideJS, or SwiperJS for more customized control. The original poster then mentions they were able to integrate a "slick" slider that worked perfectly.

Useful resources

Hello everyone,

I don't know if this is the right channel, but:

I am looking for support with the realisation of a customer project. Specifically, I need help with the design of a slider element in which only images are to be displayed. I think that the solution is probably totally simple, but somehow I have a mistake in my thinking. :D

The slider element is to be implemented using the Relume Framework and the native slider element from Webflow, also with the navigators and I need the solution by next Sunday at the latest.

The slider should be designed as follows:

3 image elements are to be visible across the width of the screen, with each image element representing a slide element and only the image element in the centre is to be visible in full and the other two images only half or the rest of the other two images (next to the central image element) are to overflow, i.e. run beyond the width of the screen. Can anyone help me with the design?

Visually, the whole thing should look something like this:

M
K
3 comments

I would say all of the results that showed up here are pretty solid.
https://www.youtube.com/results?search_query=webflow+native+slider

There are a few more advanced ways to go about sliders - for those I would search Timothy Ricks specifically.

And lastly, for more customized control over a slider, or to populate using the CMS, one way is to use the Finsweet CMS Slider or using a library like SplideJS or SwiperJS.

Thank you! I managed it by integrating a โ€œslickโ€ slider ๐Ÿ˜‰ It works perfectly. I will check out your suggestions!

yep, slick slider is another good one, glad you were able to get it done!

Add a reply
Sign up and join the conversation on Slack