_carousels.js 1.75 KB
import Swiper, { Navigation, Pagination, A11y, Keyboard } from 'swiper';
import 'swiper/css';
import 'swiper/css/navigation';
import 'swiper/css/pagination';
import 'swiper/css/keyboard';
import 'swiper/css/a11y';

jQuery(document).ready(function($) {



      jQuery('.carousel-items').each(function() {

        var offset = ((window.innerWidth - $('.entry-content').width() ) / 2) - 28;
        var offsetAfter = 0;
        var PerView = 'auto';
        var space = 20;

        var _id = jQuery(this).parent().attr('id');

        if(jQuery(this).hasClass('promo-carousel')) {
           offset = 0;
           PerView = 1;
           space = 0;
           offsetAfter = 0;
           _id = jQuery(this).attr('id');
        }

        if ($(window).width() < 600) {
           offset = 0;
           PerView = 1;
           space = 0;
           offsetAfter = 0;
        }

      

        var swiper_params = {
          modules: [Navigation, Pagination, A11y, Keyboard],
          slidesPerView:PerView,
          slidesOffsetAfter:offsetAfter,
          slidesOffsetBefore:offset,
          spaceBetween:space,
          slidesPerGroup:1,
          pagination: {
            el: ".swiper-pagination",
            type: 'bullets',
            clickable:"true",
          },
        
          navigation: {
            nextEl: '.swiper-button-next[data-id="'+_id+'"]',
            prevEl: '.swiper-button-prev[data-id="'+_id+'"]',
          },

          a11y: {
            prevSlideMessage: 'Previous slide',
            nextSlideMessage: 'Next slide',
          },
          keyboard: {
            enabled: true,
            onlyInViewport: false,
          },
        
        };


        new Swiper(this, swiper_params);
          console.log(swiper_params);

      });


});