Welcome :っ)

Slick 2

[JavaScript] Slick Slider 모바일 스크롤 시 autoplay 멈춤 현상

목차 문제상황 해결 문제상황 http://kenwheeler.github.io/slick/ 개발 중 autoplay: true 옵션을 주고 모바일(iOS, AOS)에서 확인 시, 첫 화면 로딩 시에는 autoplay가 동작하지만 스크롤 이후 혹은 해당 영역 터치 이후에는 autoplay가 작동하지 않았다. 아래 옵션을 추가하여 false로 설정했지만 소용없었다. pauseOnFoucs: false 포커스가 들어오면 슬라이드 이동 멈춤 pauseOnHover: false 마우스 호버 시 슬라이드 이동 멈춤 pauseOnDotsHover: false dot 호버 시 슬라이드 이동 멈춤 💡해결 구글링 한 결과 slick slider에서 제공하는 'slickPlay' 메서드를 사용하여 touchcancel, t..

Devlog/JavaScript 2022.06.09

[JavaScript/CSS] Slick Slider 오류

목차 문제 상황 해결 [css] height: 100% vs height: auto 문제 상황 slick 라이브러리를 이용하여 웹뷰에 롤링 배너를 구현하는 중에 iOS에서만 초기 렌더링시에 이미지가 정상적으로 출력되지 않는 문제가 발생했다. (아직까지 왜 iOS에서만 그런 현상이 일어나는지 파악하지 못했다 .. ) 위 사진처럼 상단 메뉴 바로 아래 롤링 배너가 있어야 하는데 이미지가 로드는 되었지만 잘리는 것처럼 보였다. css 파일 내 .slick-slide의 min-height:1px 이었는데 해당 사이즈가 min-height으로 잡히는 것이었다. 💡해결 구글링 끝에 stack overflow에서 아래와 같은 글을 발견했다. 위 방법으로는 해결되지 않았다. .slick-slide 내 height: 1..

Devlog/JavaScript 2022.06.02
반응형