Sliders

Create feature-rich, flexible sliders. Group or ungroup slides, infinite looping, auto populate CMS slides, slide numbering, scrollbars, slide and fade transitions.

Code Bracket Streamline Icon: https://streamlinehq.com

Script

The script for this powerup can be added to your Webflow project using the TooEasy Powerups Webflow App. Once the app is installed simply select the powerup(s) you'd like to use and click the "install script" button.

Cog Streamline Icon: https://streamlinehq.com
Setup

Slider Wrap

I want this Div Block to wrap all my slider elements

Track

I want this div block to contain my slides

Vertical Slider 4 Streamline Icon: https://streamlinehq.com
Options

Loop

I want the slideshow to loop forever

Next / Previous

When this button is clicked I want to change slides

Pagination

I want this div block to indicate how many slides there are in total

Scrollbar

I want this div block to contain the sliders scrollbar

Counter

I want this Text Block to display the current and total numberof slides

Breakpoints

I want to activate or deactivate the slider at a particular breakpoint

Speed

I want adjust the transition speed between slides

Direction

I want adjust the direction the slides move

Transition Type

I want change the way the slides transition

Free Scroll

I want to adjust the behaviour of when the slider is swiped / dragged

Alignment

I want to change the alignment of the cells inside the slider

Pause on Hover

I want to pause the slide transition when hovered

Autoplay

I want the slides to automatically switch on page load.

Slides Per View

I want to group slides together to act as a single slide

Slide Active State

I want to change the style of an element when a particular slide is active.

YouTube

Watch Tutorial

Name
te-slider-slides-per-view
Description

Add this attribute if you would like to group slides together.

Name
te-lightbox-button-previous
Description

Add this attribute to the icon you'd like to use as your previous button.

Name
te-lightbox-button-next
Description

Add this attribute to the icon you'd like to use as your next button.

Name
te-lightbox-button-close
Description

Add this attribute to the icon you'd like to use as your close button.

Name
te-lightbox-button-previous
Description

Add this attribute to the icon you'd like to use as your previous button.

Name
te-lightbox-button-next
Description

Add this attribute to the icon you'd like to use as your next button.

Name
te-lightbox-button-close
Description

Add this attribute to the icon you'd like to use as your close button.