@dvhb/jetslider

    1.0.2 • Public • Published

    jetSlider

    Simple plugin for making beautiful page transitions

    Demo

    Fullpage | Inline

    Options

    Option Type Default Description
    slideSelector String 'section' Selector of the slide elements
    transitionDuration Number 800 Duration of transition between slides
    scroll Boolean true Changing slides by mouse scroll
    keyboard Boolean true if parent element is <body>. Else false Changing slides by keyboard arrows
    easing String 'ease-in-out' Easing function e.g. 'linear', 'ease-in', 'cubic-bezier(0.42,0,0.58,1)'...
    onBeforeMove Function null Function which will be called with newIndex and oldIndex arguments every time when animation starts
    onAfterMove Function null Function which will be called with newIndex and oldIndex arguments every time when animation ends
    jsFallback Boolean true If true js fallback will be used for animations in browsers which don't support css transorms and transitions. If false slides will change without animation in those browsers

    Options can be changed after initialization:

    $('.slider').jetSlider(optionName, value);

    Methods

    $('.slider').jetSlider('moveto', index);
    $('.slider').jetSlider('moveup');
    $('.slider').jetSlider('movedown');
    $('.slider').jetSlider('destroy');

    Like declarative initialization?

    You can initialize plugin without js code! Just add data-jetslider attribute to slider container.

    Options can be customized by using data-* attributes:

    <div class="main" data-jetslider data-slide-selector=".page" data-transition-duration="2000" data-easing="ease-in">
         <section class="page">
             ...
         </section>
         ...
         <section class="page">
             ...
         </section>
         ...
     </div>

    License

    MIT License © dvhb

    Install

    npm i @dvhb/jetslider

    DownloadsWeekly Downloads

    1

    Version

    1.0.2

    License

    MIT

    Last publish

    Collaborators

    • sairus2k
    • r2d2dvhb
    • admindvhb
    • alexbee