jcarousel

$('.jcarousel').each(function() {
    var $carousel = $(this);

    $carousel
        .on('jcarousel:reload jcarousel:create', function () {
            var width = $carousel.innerWidth();
            $carousel.jcarousel('items').css('width', width + 'px');
        })
        .jcarousel({
            list: '.jcarousel__slider',
            items: '.jcarousel__slide',
            wrap: 'circular'
        });

    if ($carousel.data('prev')) {
        var $prev = $('#' + $carousel.data('prev') );

        $prev.jcarouselControl({
            target: '-=1',
            carousel: $carousel
        });
    }

    if ($carousel.data('next')) {
        var $next = $('#' + $carousel.data('next') );

        $next.jcarouselControl({
            target: '+=1',
            carousel: $carousel
        });
    }

    if ($carousel.data('pagination')) {
        var $pagination = $('#' + $carousel.data('pagination') );

        $pagination
            .on('jcarouselpagination:active', 'li', function() {
                $(this).addClass('active');
            })
            .on('jcarouselpagination:inactive', 'li', function() {
                $(this).removeClass('active');
            })
            .on('click', function(e) {
                e.preventDefault();
            })
            .jcarouselPagination({
                perPage: 1,
                item: function(page) {
                    return '<li><a href="#' + page + '">' + page + '</a></li>';
                },
                carousel: $carousel
            });
    }
});