@lukeboyle/lazy-slider

    1.0.1 • Public • Published

    LazyLoad Slider

    Build Status

    View the demo site - http://3stacks.github.io/lazy-slider/

    Importing the module

      // ES6
      import LazySlider from 'lazy-slider';
      // CommonJS 
      const LazySlider = require('lazy-slider');

    API & Usage

    const options = {
      // the slides' container element
      target: HTMLElement,
      
      // slide 1 is hard-coded in the page already
      slides: [
        'path/to/slide-2.html',
        'path/to/slide-3.html',
        'path/to/slide-4.html'
      ],
      
      // The class applied to each slide
      slideClass: 'ls-slide',
      
      animationClasses: {
        current:  'ls-current',
        next:     'ls-next',
        previous: 'ls-previous',
        entering: 'ls-entering',
        exiting:  'ls-exiting'
      },
      
      timings: {
        duration: 2000,
        transition: 500
      }
    };
    
    // init (call this when page has finished loading)
    const slider1 = new lazySlider(options);

    API

    destroy()

    Purpose

    The destroy method will clear out all slides except for the initial one and set it to the current.

    Usage

      slider1.destroy()

    If you wish to use destroy in a timeout, ensure you bind the slider to the destroy this.

      setTimeout(slider1.destroy.bind(slider1), 1000);

    Keywords

    none

    Install

    npm i @lukeboyle/lazy-slider

    DownloadsWeekly Downloads

    3

    Version

    1.0.1

    License

    MIT

    Last publish

    Collaborators

    • lukeboyle