https://www.msgcu.org/templates/mich_schools_2021_giving_back/partials/banner-carousel/banner-carousel.js

1var App = App || {};
2
3App.BannerCarousel = (function ($) {
4    "use strict";
5
6    var $carousel,
7        $controls;
8
9    function init() {
10        $carousel = $('#banner-carousel-slides');
11        $controls = $('#banner-carousel-controls');
12
13        $carousel.slick({
14            arrows: false,
15            autoplay: true,
16            autoplaySpeed: 7000,
17            dots: true,
18            draggable: false
19        });
20
21        if ($controls) {
22            var $play = $controls.find('.play'),
23                $pause = $controls.find('.pause');
24
25
26            $controls.on('click', 'button', function (e) {
27                var $this = $(this);
28                e.preventDefault();
29                $carousel.slick($this.data('action'));
30
31                if ($this.hasClass('play')) {
32                    $play.hide();
33                    $pause.show();
34                } else if ($this.hasClass('pause')) {
35                    $play.show();
36                    $pause.hide();
37                }
38            });
39        }
40    }
41
42    return {
43        init: init
44    };
45})(jQuery);
46
47$(function () {
48    App.BannerCarousel.init();
49});