https://www.greenscapegroup.co.in/wp-content/themes/goarch/js/custom-slider.js

1/**
2 * Custom Slider JavaScript for GoArch Theme
3 * A modern replacement for Slider Revolution
4 */
5
6jQuery(document).ready(function($) {
7    // Initialize Swiper slider
8    if ($('.goarch-custom-slider').length > 0) {
9        var slider = new Swiper('.goarch-custom-slider', {
10            // Optional parameters
11            direction: 'horizontal',
12            loop: true,
13            speed: 1400,
14            effect: 'fade',
15            fadeEffect: {
16                crossFade: true
17            },
18            autoplay: {
19                delay: 9000,
20                disableOnInteraction: false,
21            },
22            
23            // If we need pagination
24            pagination: {
25                el: '.swiper-pagination',
26                clickable: true
27            },
28            
29            // Navigation arrows
30            navigation: {
31                nextEl: '.swiper-button-next',
32                prevEl: '.swiper-button-prev',
33            },
34            
35            // And if we need keyboard control
36            keyboard: {
37                enabled: true,
38            },
39            
40            // Responsive breakpoints
41            breakpoints: {
42                // when window width is >= 320px
43                320: {
44                    slidesPerView: 1,
45                    spaceBetween: 20
46                },
47                // when window width is >= 640px
48                640: {
49                    slidesPerView: 1,
50                    spaceBetween: 0
51                },
52            }
53        });
54
55        // Match legacy hero controls and counter behavior.
56        var $count = $('.slide-number .count');
57        var $total = $('.slide-number .total-count');
58        var total = $('.goarch-custom-slider .swiper-slide:not(.swiper-slide-duplicate)').length;
59        if (!total || total < 1) {
60            total = 3;
61        }
62        var format = function(n) { return n < 10 ? ('0' + n) : String(n); };
63        $total.text('03');
64        $count.text(format(slider.realIndex + 1));
65
66        $('.arrow-left').on('click', function () {
67            slider.slidePrev();
68        });
69        $('.arrow-right').on('click', function () {
70            slider.slideNext();
71        });
72
73        var enterTimer = null;
74
75        function markSlideStates(delayEnter) {
76            var $slides = $(slider.slides);
77            var $active = $(slider.slides[slider.activeIndex]);
78            var $prev = $(slider.slides[slider.previousIndex]);
79
80            $slides.removeClass('is-entering is-exiting is-pre-enter');
81            $prev.addClass('is-exiting');
82
83            if (enterTimer) {
84                clearTimeout(enterTimer);
85                enterTimer = null;
86            }
87
88            if (delayEnter) {
89                $active.addClass('is-pre-enter');
90                enterTimer = setTimeout(function () {
91                    $('.goarch-custom-slider .swiper-slide-active')
92                        .removeClass('is-pre-enter')
93                        .addClass('is-entering');
94                }, 1200);
95            } else {
96                $active.addClass('is-entering');
97            }
98        }
99
100        slider.on('slideChangeTransitionStart', function () {
101            markSlideStates(true);
102        });
103
104        slider.on('slideChangeTransitionEnd', function () {
105            // no per-slide title intro replay
106        });
107
108        markSlideStates(false);
109
110        slider.on('slideChange', function () {
111            var current = slider.realIndex + 1;
112            $count.text(format(current));
113        });
114    }
115});