// 반응형 설정
var swiper = new Swiper('.swiper-container', {
slidesPerView: 1, //레이아웃 뷰 개수
spaceBetween: 10, //위 slidesPerview 여백
breakpoints: { //반응형 width
640: { //640 이상일 경우
slidesPerView: 2, //레이아웃 2 },
768: { slidesPerView: 3, }, 1024: { slidesPerView: 4, }, } });
//비율(가로/세로)가능
breakpoints: {
'@0.75': {
slidesPerView: 2,
spaceBetween: 20,
},
'@1.00': {
slidesPerView: 3,
spaceBetween: 40,
},
'@1.50': {
slidesPerView: 4,
spaceBetween: 50,
}
//옵션 설정
freeMode : false, // 슬라이드 넘길 때 위치 고정 여부
autoHeight : true, // 현재 활성 슬라이드높이 맞게 높이조정
a11y : false, // 접근성 매개변수(접근성 관련 대체 텍스트 설정이 가능)
resistance : false, // 슬라이드 터치 저항 여부
slideToClickedSlide : true, // 해당 슬라이드 클릭시 슬라이드 위치로 이동
allowTouchMove : true, // (false-스와이핑안됨)버튼으로만 슬라이드 조작이 가능
watchOverflow : true // 슬라이드가 1개 일 때 pager, button 숨김 여부 설정
slidesOffsetBefore : number, // 슬라이드 시작 부분 여백
slidesOffsetAfter : number,
//초기화 설정