안녕하세요 swiper 관련 질문 드릴께요

2022-03-16 (수) 12:26:37 1,805

아래 코드가 크롬에서는 정상 동작을 하는데 사파리에서 동작이 안됩니다.

 뭐가 잘못된건지 도저히 모르겠어요  도움이 필요합니다. 

var swiperTabsNav = new Swiper('.swiper-tabs-nav', {

      slidesPerView: 'auto',

      preventClicks: true,

      preventClicksPropagation: false,

      autoHeight: false,

      observer: true,

      observeParents: true

    });

    var $snbSwiperItem = $('.swiper-tabs-nav .swiper-wrapper .swiper-slide span');

        $snbSwiperItem.click(function(){

            var target = $(this).parent();

            $snbSwiperItem.parent().removeClass('active')

            target.addClass('active');

            muCenter(target);

        })

      function muCenter(target){

          var snbwrap = $('.swiper-tabs-nav .swiper-wrapper');

          var targetPos = target.position();

          var box = $('.swiper-tabs-nav');

          var boxHarf = box.width()/2;

          var pos;

          var listWidth=0;

          snbwrap.find('.swiper-slide').each(function(){ listWidth += $(this).outerWidth(); })

          var selectTargetPos = targetPos.left + target.outerWidth()/2;

          if (selectTargetPos <= boxHarf) { // left

              pos = 0;

          }else if ((listWidth - selectTargetPos) <= boxHarf) { //right

              pos = listWidth-box.width();

          }else {

              pos = selectTargetPos - boxHarf;

          }

          setTimeout(function(){snbwrap.css({

              "transform": "translate3d("+ (pos*-1) +"px, 0, 0)",

              "transition-duration": "500ms"

          })}, 200);

          if (document.querySelector('.service-wrap').scrollTop) {

            document.querySelector('.service-wrap').scrollTo(0, 0)

          }

      }

    // Swiper Content

    var swiperTabsContent = new Swiper('.swiper-tabs-content', {

      spaceBetween: 0,

      loop:false,

      autoHeight: true,

      longSwipes: true,

      resistanceRatio: 0, // Disable First and Last Swiper

      watchOverflow: true,

      loopedSlides: 5,

      thumbs: {

        swiper: swiperTabsNav,

      },

    });

    swiperTabsContent.on('slideChange', function() {

      muCenter($(document.querySelector('div.swiper-slide-thumb-active')))

    })

|

답변 1개 / 댓글 2개

2022-03-16 (수) 13:17:57

하다 못해 에러 코드라도 있어야 해결하죠 ㅎㅎ

답변에 대한 댓글 2개

2022-03-17 (목) 13:59:51
사파리 에러 코드입니다.
2swiper.min.js:12TypeError: 'undefined' is not an object (evaluating 'a.visibleSlidesIndexes.indexOf')

도움 부탁드릴께요
조금 검색해봤는데 safari 에서 호환이 안되는거 같네요
버젼을 올려보시라는 말밖에는....

답변을 작성하려면 로그인이 필요합니다.