0.8.9 • Published 2 years ago

ls-slider v0.8.9

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

ls-slider

A lightweight JS/CSS Slider with focus on native mobile touch controls

This plugin is still in the works and will need some additional adaptions and features before reaching 1.0.0. Please do NOT use this for production in its current state!!

Pre-release To-Do's

  • fix indicator scroll animation
  • fix infinite scroll on mobile
  • fix initial slide position when infinite are active
  • add visible slides functionality
  • consider accessibility (might be done after initial release)
  • code cleanup

Post-release To-Do's

  • add lazy loading

Setup

ls-slider is initialized by passing the elements and options to a JS class. For example:

import Slider from "ls-slider";

const slider = document.querySelector(".slider-element");
const options = { infinite: true };

new Slider(slider, options);

Options

visibleSlides

TypeDefaultDescription
Number1The amount of slides that should be visible in the slider

startingIndex

TypeDefaultDescription
Number0The slide index that will initially be displayed

sliderElementClass

TypeDefaultDescription
String""A class that will be added to the individual slider elements next to ls-element

touchControls

TypeDefaultDescription
BooleantrueThis enables native touch controls, which allow native swiping to switch slides. This setting will only affect touch devices

autoSlide

TypeDefaultDescription
BooleanfalseToggle for automatic sliding

interval

TypeDefaultDescription
Number5000Interval for the automatic sliding in ms

direction

TypeDefaultDescription
SlideDirection ("left", "right")SlideDirection.Right ("right")The direction of the automatic slide

previousButton

TypeDefaultDescription
String""<button class="ls-previous-button"></button>

nextButton

TypeDefaultDescription
String""<button class="ls-next-button"></button>

infinite

TypeDefaultDescription
BooleanfalseToggle for infinite styling

indicators

TypeDefaultDescription
BooleantrueToggle for indicators
0.8.9

2 years ago

0.8.8

2 years ago