Dynamic carousel

dynamicCarousel.js

//uses hammer.js to detect swipe and trigger next/prev buttons
//counts numbers of child items to handle carousel and add bullets in mobile view
eventSlider: function() {
        var marginArray = [];
        var i = 0;
        var length = jQuery('.home--2-col-events--right--slider-slide').length;

        //set container and child widths
        jQuery('.home--2-col-events--right--slider-container').css(
            'width', ((length * 100) + 1) + '%'
        );
        jQuery('.home--2-col-events--right--slider-slide').css(
            'width', (100 / length) + '%'
        );
        //set marginArray based on childnum
        for (var j = 0; j < length; j++) {
            marginArray.push((j * -100) + '%');
            //populate bullets
            j === 0 ? jQuery('.home--2-col-events--bullets').append('<li class="is-active"><button></button></li>') : jQuery('.home--2-col-events--bullets').append('<li class=""><button></button></li>');
        }


        if (window.innerWidth < 1366) {
            trellisUtilities.detectSwipe('#home--2-col-events--prev', '#home--2-col-events--next', '#home--2-col-events');
        }
        jQuery('#home--2-col-events--prev').click(function() {
            i--;
            i === -1 ? i = length - 1 : i;
            jQuery('.home--2-col-events--right--slider-container').css('margin-left', marginArray[i]);
            /*bullet logic*/
            jQuery('.home--2-col-events--bullets li').each(function() {
                jQuery(this).removeClass('is-active');
            });
            jQuery('.home--2-col-events--bullets li:nth-of-type(' + (i + 1) + ')').addClass('is-active');
        });
        jQuery('#home--2-col-events--next').click(function() {
            i++;
            i === length ? i = 0 : i;
            jQuery('.home--2-col-events--right--slider-container').css('margin-left', marginArray[i]);
            /*bullet logic*/
            jQuery('.home--2-col-events--bullets li').each(function() {
                jQuery(this).removeClass('is-active');
            });
            jQuery('.home--2-col-events--bullets li:nth-of-type(' + (i + 1) + ')').addClass('is-active');
        });
    },