Slider Scroll 1 By 1 & Only 1 Active Item

Design help General
1

I have a slider that I am trying to get to scroll 1 item at a time.
I only want the first item to have an active state, and the remaining items will hide the short description under the heading.
Can you explain how I can get this working with the default webflow slider?
I watched Nelson’s video from 2018 and it looks like the single scroll method was a default implementation, but my slider is scrolling through 3 items at a time and I do not want that effect.

Quick Recap:

  • Slide 1 slide at a time.
  • Target 1st item as active.
  • All remaining slides “inactive” with different styling.

Thanks in advance!

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

2

Hey Lindsey,

I am not sure the default Webflow slider is able to do what you are searching for. I would personally recommend that you integrate a slider library like SwiperJS. With this library you can get the current active slide index and many other methods/properties to customize your slider. Then using some custom code, you should be able to achieve what you what :slight_smile:

3

I read the documentation last night, and it said “add the folder to your website” which we don’t have that kind of setup with webflow. Can you explain the best way to integrate it?