/home/moonrcjl/template.moontelict.com/freegen/assets/js/slider-init.js
/***************************************************
==================== JS INDEX ======================
****************************************************
01. mttestimonial__active
02. mttextslider__active
03. mt-testimonial-active
04. mt-team-slider-active
****************************************************/
(function ($) {
"use strict";
////////////////////////////////////////////////////
// 01. Swiper Js
var swiper = new Swiper(".mttestimonial__active", {
slidesPerView: 1,
spaceBetween: 30,
loop: true,
keyboard: {
enabled: true,
},
navigation: {
nextEl: ".mttestimonial__button-next",
prevEl: ".mttestimonial__button-prev",
},
});
////////////////////////////////////////////////////
// 02. mttextslider__active
var mt_brand_slide = new Swiper(".mttextslider__active", {
loop: true,
freemode: true,
slidesPerView: 'auto',
spaceBetween: 0,
centeredSlides: true,
allowTouchMove: false,
speed: 8000,
autoplay: {
delay: 1,
disableOnInteraction: true,
},
});
////////////////////////////////////////////////////
// 03. mt-testimonial-slider-active
const progressBar = $(".mt-slider-progress-bar span");
var swiper = new Swiper(".mt-testimonial-active", {
slidesPerView: 1,
spaceBetween: 24,
loop: true,
autoplay: false,
arrow: false,
speed: 1000,
a11y: false,
breakpoints: {
1781: {
slidesPerView: 2,
},
1199: {
slidesPerView: 2,
},
991: {
slidesPerView: 1,
},
767: {
slidesPerView: 1,
},
550: {
slidesPerView: 1,
},
0: {
slidesPerView: 1,
},
},
pagination: {
el: '#paginations',
type: 'custom',
renderCustom: function (swiper, current, total) {
let zero = total > 9 ? '' : '0';
let index = zero + current
let all = zero + total
let html = `<div class="mt-slider-pagination">
<span>${index}</span>
<span>${all}</span>
</div>`;
return html;
}
},
autoplay: {
delay: 2500,
disableOnInteraction: false
},
on: {
autoplayTimeLeft(s, time, progress) {
progressBar.css({
"transform": `scaleX(calc(1 - ${progress}))`
})
}
},
});
})(jQuery);