swiper 혼자 멈추는 오류 왜이럴까요 ㅠㅠ 채택완료
두개를 연달아 넣어두었으며 클래스명도 다 다르게 줬습니다! 초반에는 괜찮게 구현되다가 갑자기 autoplay가 멈추네요ㅠㅠ 왜그럴까요 ...
html
Copy
//첫번째 스와이퍼
자바스크립트
Copy
// main_cont05_swiper01
var main_cont05_swiper_num01 = $('.main_cont05_swiper01').find('.main_cont05_01_slide');
var main_cont05_swiper01 = new Swiper('.main_cont05_swiper01', {
slidesPerView: "auto",
spaceBetween: 10,
autoplay: {
delay: 0,
disableOnInteraction: false,
},
allowTouchMove: false,
touchRatio: 0.2,
speed: 7000,
// freeMode: true,
loop: true,
loopedSlides: main_cont05_swiper_num01.length,
observer: true,
observeParents: true,
});
// main_cont05_swiper02
var main_cont05_swiper_num02 = $('.main_cont05_swiper02').find('.main_cont05_02_slide');
var main_cont05_swiper02 = new Swiper('.main_cont05_swiper02', {
slidesPerView: "auto",
spaceBetween: 10,
autoplay: {
delay: 0,
disableOnInteraction: false,
},
allowTouchMove: false,
// touchRatio: 0.2,
speed: 7000,
// freeMode: true,
loop: true,
loopedSlides: main_cont05_swiper_num02.length,
observer: true,
observeParents: true,
pauseOnFocus: false,
});
답변 1개
채택된 답변
+20 포인트
1년 전
다음과 같이 해보시겠어요?
Copy
// main_cont05_swiper01
var main_cont05_swiper_num01 = $('.main_cont05_swiper01').find('.main_cont05_01_slide');
var main_cont05_swiper01 = new Swiper('.main_cont05_swiper01', {
slidesPerView: "auto",
spaceBetween: 10,
autoplay: {
delay: 5000, // 적절한 값을 설정하세요 (밀리초 단위)
disableOnInteraction: false,
},
allowTouchMove: false,
touchRatio: 0.2,
speed: 7000,
loop: true,
loopedSlides: main_cont05_swiper_num01.length,
observer: true,
observeParents: true,
});
// main_cont05_swiper02
var main_cont05_swiper_num02 = $('.main_cont05_swiper02').find('.main_cont05_02_slide');
var main_cont05_swiper02 = new Swiper('.main_cont05_swiper02', {
slidesPerView: "auto",
spaceBetween: 10,
autoplay: {
delay: 5000, // 적절한 값을 설정하세요 (밀리초 단위)
disableOnInteraction: false,
},
allowTouchMove: false,
speed: 7000,
loop: true,
loopedSlides: main_cont05_swiper_num02.length,
observer: true,
observeParents: true,
pauseOnFocus: false,
});
로그인 후 평가할 수 있습니다
답변에 대한 댓글 3개
�
1년 전
[code]
autoplay: {
delay: 5000, // 5000 밀리초 = 5초, 적절한 값으로 조절
disableOnInteraction: false,
},
[/code]
이 값이 자동 재생 간격을 의미합니다. 이 값이 적을수록 간격이 짧아지므로 적절히 조정해 보세요
그래도 안되신다면 다음과 같이 적용해 보시겠어요?
[code]
// main_cont05_swiper01
var main_cont05_swiper_num01 = $('.main_cont05_swiper01').find('.main_cont05_01_slide');
var main_cont05_swiper01 = new Swiper('.main_cont05_swiper01', {
slidesPerView: "auto",
spaceBetween: 10,
autoplay: {
delay: 5000, // 적절한 값을 설정하세요 (밀리초 단위)
disableOnInteraction: false,
},
allowTouchMove: false,
touchRatio: 0.2,
speed: 7000,
loop: true,
loopedSlides: main_cont05_swiper_num01.length,
observer: true,
observeParents: true,
});
// main_cont05_swiper02
var main_cont05_swiper_num02 = $('.main_cont05_swiper02').find('.main_cont05_02_slide');
var main_cont05_swiper02 = new Swiper('.main_cont05_swiper02', {
slidesPerView: "auto",
spaceBetween: 10,
autoplay: {
delay: 5000, // 적절한 값을 설정하세요 (밀리초 단위)
disableOnInteraction: false,
},
allowTouchMove: false,
speed: 7000,
loop: true,
loopedSlides: main_cont05_swiper_num02.length,
observer: true,
observeParents: true,
pauseOnFocus: false,
});
// Swiper 이벤트 모니터링
main_cont05_swiper01.on('slideChange', function () {
console.log('Swiper 01: Slide changed');
});
main_cont05_swiper02.on('slideChange', function () {
console.log('Swiper 02: Slide changed');
});
[/code]
또한 개발자모드에서 콘솔에서 어떠한 에러가 출력되는지 확인해 보시고 수정을 하시는게 좋을 듯 합니다
autoplay: {
delay: 5000, // 5000 밀리초 = 5초, 적절한 값으로 조절
disableOnInteraction: false,
},
[/code]
이 값이 자동 재생 간격을 의미합니다. 이 값이 적을수록 간격이 짧아지므로 적절히 조정해 보세요
그래도 안되신다면 다음과 같이 적용해 보시겠어요?
[code]
// main_cont05_swiper01
var main_cont05_swiper_num01 = $('.main_cont05_swiper01').find('.main_cont05_01_slide');
var main_cont05_swiper01 = new Swiper('.main_cont05_swiper01', {
slidesPerView: "auto",
spaceBetween: 10,
autoplay: {
delay: 5000, // 적절한 값을 설정하세요 (밀리초 단위)
disableOnInteraction: false,
},
allowTouchMove: false,
touchRatio: 0.2,
speed: 7000,
loop: true,
loopedSlides: main_cont05_swiper_num01.length,
observer: true,
observeParents: true,
});
// main_cont05_swiper02
var main_cont05_swiper_num02 = $('.main_cont05_swiper02').find('.main_cont05_02_slide');
var main_cont05_swiper02 = new Swiper('.main_cont05_swiper02', {
slidesPerView: "auto",
spaceBetween: 10,
autoplay: {
delay: 5000, // 적절한 값을 설정하세요 (밀리초 단위)
disableOnInteraction: false,
},
allowTouchMove: false,
speed: 7000,
loop: true,
loopedSlides: main_cont05_swiper_num02.length,
observer: true,
observeParents: true,
pauseOnFocus: false,
});
// Swiper 이벤트 모니터링
main_cont05_swiper01.on('slideChange', function () {
console.log('Swiper 01: Slide changed');
});
main_cont05_swiper02.on('slideChange', function () {
console.log('Swiper 02: Slide changed');
});
[/code]
또한 개발자모드에서 콘솔에서 어떠한 에러가 출력되는지 확인해 보시고 수정을 하시는게 좋을 듯 합니다
�
1년 전
개발자도구에서도 오류가 없었고, 안내해주신 방법으로는 수정이 안되네요 ㅠㅠ 그래도 다른 방법 이것저것 해보다가 수정되었습니다! 도움주셔서 감사합니다 ㅎㅎ
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인