Custom Easing

You can pass easing property via lightGallery easing setting. Bellow you can find some of the possible values of cssEasing. Demo values are taken from @matthewlein`s ceaser

Demo

Change easing :
HTML Structure 
<div id="gallery-custom-easing-demo">
    <a href="img/img1.jpg">
        <img src="img/thumb1.jpg" />
    </a>
    <a href="img/img2.jpg">
        <img src="img/thumb2.jpg" />
    </a>
    ...
</div>
JavaScript 
lightGallery(document.getElementById('gallery-custom-easing-demo'), {
    cssEasing: 'cubic-bezier(0.680, -0.550, 0.265, 1.550)',
    // increasing speed to see the easing correctly
    // Just for the demo purpose
    speed: 1000,
});

Edit this page on GitHub

← Events
Captions →