Vm-slider-js NPM

What is this?

Get simple slider for your application

Version

4.4.0

Installation

Install the package

npm

npm install vm-slider-js

yarn

yarn add vm-slider-js

Usage

HTML

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Slider App</title>
    <style>
        * {
            box-sizing: border-box;
        }
    </style>
</head>

<body>
    <div id="slider">
        <img src="#" alt="Slider #1" />
        <img src="#" alt="Slider #2" />
        <img src="#" alt="Slider #3" />
        <img src="#" alt="Slider #4" />
    </div>

    <script src="./dist/vm-slider-js.js"></script>
    <script>
        document.addEventListener("DOMContentLoaded", function (event) {
            new SliderJS('slider', options)
        })
    </script>
</body>

</html>

NPM

import { SliderJS } from 'vm-slider-js'

new SliderJS('slider', options)

Options

You can pass the 2nd argument as an object with options

SliderJS supports 5 options which are all optional:

width - size of images in (px) (Default 940)
height - height of images (px) (Default is 270)
iconSize - height of icons (px) (Default is 60)
timeout - auto sliding timer (ms) (Default is 3000)
hideControls - true / false (Default is false)

slider

@everything-registry/sub-chunk-3065

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago