Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

@sideshowsystems/jquery-sbs-slider

jQuery Image Side By Side Slider

slider, slick, js, jquery

readme

jquery-sbs-slider

npm (scoped) npm (scoped)

jQuery SideBySide Slider

Package Managers

# NPM
npm install @sideshowsystems/jquery-sbs-slider

Usage

HTML

<div class="img_sbs_box">
    <div class="imgwrapper imgleft">
        <img src="image-left.jpg" />
    </div>
    <div class="imgwrapper imgright">
        <img src="image-right.jpg" />
    </div>
</div>

Java Script

$('.img_sbs_box').sbsbox();

with options

$('.img_sbs_box').sbsbox({
    showPcnt: 90
});

Settings

Option Type Default Description
aniSpeed int 250 Animation speed in milliseconds
showPcnt int 85 Percentage of image reveal