支持移动触摸设备的简洁js幻灯片插件 A Touch enabled minimalistic slider written in vanilla JavaScript

Single element

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6

    document.addEventListener('DOMContentLoaded', function () {
        var simple = document.querySelector('.js_simple');

        lory(simple, {
            infinite: 1
        });
    });

Variable width

  • 220
  • 190
  • 150
  • 130
  • 250
  • 180
  • 200
  • 140
  • 120
  • 240

    document.addEventListener('DOMContentLoaded', function () {
        var variableWidth = document.querySelector('.js_variablewlidth');

        lory(variableWidth, {
            rewind: true
        });
    });

Multiple slides to scroll

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12

    document.addEventListener('DOMContentLoaded', function () {
        var multiSlides = document.querySelector('.js_multislides');

        lory(multiSlides, {
            infinite: 4,
            slidesToScroll: 4
        });
    });

Custom easings

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12

    document.addEventListener('DOMContentLoaded', function () {
        var ease = document.querySelector('.js_ease');

        // http://easings.net/

        lory(ease, {
            infinite: 4,
            slidesToScroll: 4,
            slideSpeed: 1000,
            ease: 'cubic-bezier(0.455, 0.03, 0.515, 0.955)'
        });
    });