sm-sliderjs v1.0.2

Sunmedia slider

This is a very basic html slider that comes with a bunch of basic functionalities.

How to use

We must import the slider plugin

  <script src="sm_slider.js"></script>

We initialize it

    const opts = {
      container: "slider1",
      nav: true,
      autoplay: false,
      loop: true,
      dots: true
    };
    var slider1 = new SMSlider(opts);

Make sure you do import the slider plugin before starting the slider.

Options

List including all options which are optional except the container argument.

autoplay

Type: Boolean
Default: false

Autoplay.

backgroundColor

Type: String/Number
Default: eff1f4

Sets a the background colour of each one of the slider slides.

border

Type: Boolean
Default: false

Displays a border within default value between the slides.

container

Type: String
Default: undefined

Html element that we want to target as our slider container.

Shows navigator.

currentSlide

Type: Number
Default: 0

Sets the initial slide position where the portrait should be focusing.

direction

Type: String
Default: horizontal

Possible values 'vertical'/'horizontal'.

dots

Type: Boolean
Default: true

Show dots navigation.

navigator

Type: Boolean
Default: true

slidesInView

Type: Number
Default: 1

The number of slides you want to see on slider portrait.

swipeable

Type: Boolean
Default: false

Enables dragging events.

thumbnails

Type: Boolean
Default: false

Set of thumbnails that allow us to navigate.

transitionTime

Type: Number
Default: 2

transitionFlow

Type: String
Default: ease

Possible values: 'ease', 'linear', 'ease-in', 'ease-out', 'ease-in-out';