🕹 스크립트

제이쿼리 dispaly:none > block 되는 탭에서 슬릭슬라이더 로딩 안될 때

(。θᗨθ。) 2022. 8. 25. 15:37
function sliderSet(slickfor,slicknav){
    slickfor.slick({
      slidesToShow: 1,
      slidesToScroll: 1,
      arrows: false,
      fade: true,
      asNavFor:slicknav
    });
    slicknav.slick({
      slidesToScroll: 1,
      slidesToShow: 5,
      arrows: true,
      centerMode: true,
      focusOnSelect: true,
      asNavFor: slickfor
    });
}

$('.facility_pannel').each(function(i,el){
    i+=1; 
    var slickfor = $(el).find('.facility_slider').addClass('slider'+ i)
    var slicknav = $(el).find('.facility_pager').addClass('pager'+ i)
    sliderSet(slickfor,slicknav);
})

$('.facility_btn li').click(function(){
    let i = $(this).index();
    $(this).addClass('active').siblings().removeClass('active');
    $('.facility_pannel .slide_wrap').eq(i).addClass('active').siblings().removeClass('active');
    $('.facility_pager').slick('setPosition');//클릭했을 때 이 부분 추가(슬라이드 될 부분)
    return false;
});
728x90