Next Slider

Next Slider is based on a complete integration of the powerful splidejs library. Its a nestable slider that contains “Slide Blocks”. Each “Slide Block” has a “Content” element whose function is to wrap all the content of that slide. You can place everything you want inside the slide at this “Content” element.

Type: Slide or Loop. Loop type makes the slider continue from the end to the first slide.
Auto width: if true, the width of the slides are determined by their own width.
Per Move: determines the number of slides to move at once.
Speed: the higher the speed number is the slower the slide movement.
Drag: it can be true, false or free:
– True: slider can be draggable and each slide is placed in its correspondant slider when dragging.
– False: slider can’t be draggable.
– Free: slider can be draggable without placing each slide in its correspondant slider when dragging.
Snap: if true, dragging will place to the nearest slide. Drag must be set to free.
CSS easing: determines the easing of slider’s transitions. You can set any custom CSS easing of your own. Learn more about CSS easings here.

Rewind: when the slider ends it returns to the beginning. Available only at Type: Slide
Rewind speed: determines the rewind movement speed.
Rewind by drag: allows rewind when dragging.

Flick power: the larger number this is, the farther the slider runs between slides.
Flick max pages: limits the number of pages to move by the flick action.

Keyboard: enables custom keyboard shortcuts. Can be true, false or global.
Wheel: enables navigation by the mouse wheel on hover.
Wheel sleep: the sleep duration in milliseconds until accepting next wheel.
Release wheel: determines whether to release the wheel event when the slider reaches the first or last slide so that the user can scroll the page continuously. Available only with Rewind: false.

Gap: spacing gap between slides.
Starting slide: the slide where the slider should start.
Per page: determines the number of slides to display in the slider. Auto Width must be set to false.
Per move: determines the number of slides to move at once.
Per page breakpoints: lets you set the number of slides to display per each customizable breakpoint.

Arrows: if false, arrows won´t be included at the slider.
Scale: determines the size of the arrows.
Previous Arrow & Next Arrow Styling: you are able to customize the icon, display, margin, color and background styling of each arrow.

Pagination: if false, pagination won’t be included at the slider.
Active dot color & Inactive dot color: sets the color of the dot pagination.
Justify: you are able to justify the position of the pagination at the slider.
Margin: pagination margin.

Autoplay: if false, sliders won’t autoplay.
Omit End: if the ending slides are already in viewport, they will be omitted.
Interval: autoplay interval duration between slides.
Pause on hover: wether to pause autoplay on hover or not.
Lazy load: False, Nearby or Sequential:
– False: disables lazy loading.
– Nearby: Starts loading only images around the active slide page.
– Sequential: Loads images sequentially..
Navigation direction: the direction of the autoplay. It can be ltr (Left to Right) or rtl (Right to Left).
*NOTE: navigation direction can also change navigation direction of Autoscroll.
isNavigation: if true, each slide has its own pagination dot.

Autoscroll: if false, slider won’t autoscroll. If slider is set to loop then it will result in a marquee effect.
Autostart: if true, autoscroll will play on window load.
Autoscroll speed: the higher the speed is the higher the autoscroll runs.
Pause on hover: wether to pause autoplay on hover or not.
Rewind: if true, autoscroll will rewind to the beginning of the slider when it reaches the end. Slider must be of type slide.

– Tamu