Swiper.js

Swiper.js란 모바일 및 데스크탑에 사용하기 적합한 오픈소스 JavaScript 라이브러리

Grid

CSS 그리드 레이아웃(= Grid Layout)은 페이지를 여러 주요 영역으로 나눌 수 있고, 크기와 위치 및 문서 계층 구조의 관점에서 HTML 기본 요소로 작성된 콘트롤 간의 관계를 정의하는 데 아주 유용하다.

문제점

• 모바일 분기점에서 강제로 column을 2줄로 떨굴 경우 swiper가 변경되는 width를 인식하지 못하는 문제 발생

• grid를 사용할 경우 resize가 2번 이상 발생 시 인식하지 못함.

해결 방법

• 모든 항목에 grid를 넣어주어야 한다.

• swiper: 높이 잡기, swiper-slide: 높이 auto로 해주어야 한다.

• 위 항목 중 하나라도 빠지면 해결되지 않는다.

  • 검색하였을 때 observe 로 해결했다는 내용도 많으나 나는 전혀 해결되지 않았다.