I am trying to create a slider using Owl-carousel, but I'm having trouble implementing it. I came across this example https://codepen.io/Webevasion/pen/EPMGQe
https://i.stack.imgur.com/KnnaN.jpg
However, the code from this example doesn't seem to work for me. It appears to be from an old version of owl-carousel and I think the solution may lie in afterAction. But what has afterAction been replaced with in the second version?
Here is my code:
$(document).ready(function($) {
$('.gallery').owlCarousel({
loop:true,
margin:0,
responsiveClass:true,
items:7,
center: true,
nav: true,
navText : ["<i class='fas fa-chevron-left'></i>","<i class='fas fa-chevron-right'></i>"],
onDragged: callback
});
$(".center").next().addClass("near");
$(".center").prev().addClass("near");
$(".center").nextAll().eq(1).addClass("next");
$(".center").prevAll().eq(1).addClass("next");
$(".center").nextAll().eq(2).addClass("last");
$(".center").prevAll().eq(2).addClass("last");
$(".center").nextAll().eq(3).addClass("lastest");
$(".center").prevAll().eq(3).addClass("lastest");...
}
The full code can be found at jsfiddle.net/kzcbdLjs/
Visit the website at tempes74.beget.tech