swiper 슬라이드 모바일에서 적용 궁금한 사항이 있습니다. 채택완료
swiper 슬라이드 사용에 궁금한 사항이 있어서 문의드립니다.
해당 슬라이드 사용시 여러가지 옵션이 있는데 태블릿/모바일에서는 allowTouchMove 옵션을 주려고 하는데 G5_IS_MOBILE()이나 is_mobile() 같은 부분으로 구분해서 구현이 가능할까요?
기본적으로는 breakpoints: 옵션으로 구분을 하는걸로 아는데 문제는 태블릿/모바일 크기가 워낙 다양해서 어떤 태블릿에서는 적용되고 어떤 태블릿에서는 적용이 안되어서 문제입니다.
아래는 일부 코드 입니다.
var swiper = new Swiper('.slide1', {
initialSlide: 6,
spaceBetween: 0,
speed: 1000,
mousewheel: true,
.......
breakpoints: {
320: {
allowTouchMove: true,
},
1600: {
allowTouchMove: false,
},
}
여기서 기본적으로는 breakpoints에서 1600 저 부분을 768또는 880 이렇게 하는데 태블릿으로 가로 버전으로 보았을시 문제가 되고 있습니다. 그래서 태블릿 가로로 보았을시도 생각해서 위와 같이 하였는데 1600은 PC나 노트북에서도 문제가 되는 크기라서 여기를 is_mobile 이나 이런걸로 구분 가능할지 궁금합니다.
답변 1개
답변에 대한 댓글 3개
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
allowTouchMove는 true 또는 false 밖에 없는걸로 알고 있습니다.
현재 반응형 디자인을 사용해서 config.php 에서 define('G5_USE_MOBILE', false); 이렇게 사용하고 있습니다.
allowTouchMove: g5_is_mobile
그래서 위와 같이 하면무조건 false로 적용되는듯 하고
allowTouchMove: is_mobile()
이렇게 적용하면 오류가 바로 나오고 있습니다.
하나는 변수라서 적용되나 false로 사용하고 있고 하나는 함수라서 오류를 나타내고 있는듯 합니다.
is_mobile() 이 부분으로 해야 할듯 한데 include를 시켜서 따로 사용해야 하는지 아니면 다른 방법으로 해야 하는지 궁금합니다.