영카트 소스코드를 고치는 내용은 아닙니다.
쇼핑몰 메인페이지에서 주로 사용하는 swiper 배너를 여러개가 연속으로 보여지도록 하는 코딩입니다.
지마켓 첫페이지를 보면 이해가 되실겁니다.
주요사항
배너가 좌우로 연속으로 슬라이드 된다.
(실제로는 표시되는 현재 배너의 이전/이후의 것이 사라지지 않고 보여지는 효과임)
이전/이후의 영역은 다른 엘리먼트(레이어)가 덮어 사용될 수 있다.
이전/이후의 배너는 스와이프 자체의 클릭(드래그)효과를 비활성시킨다.
코딩 결과
https://jsbin.com/nogesem/edit?html,css,js,output
몇시간 투자한 것이 아까워서 공유합니다.
필요한 분에게 도움이 되었으면 합니다.
쇼핑몰 메인페이지에서 주로 사용하는 swiper 배너를 여러개가 연속으로 보여지도록 하는 코딩입니다.
지마켓 첫페이지를 보면 이해가 되실겁니다.
주요사항
배너가 좌우로 연속으로 슬라이드 된다.
(실제로는 표시되는 현재 배너의 이전/이후의 것이 사라지지 않고 보여지는 효과임)
이전/이후의 영역은 다른 엘리먼트(레이어)가 덮어 사용될 수 있다.
이전/이후의 배너는 스와이프 자체의 클릭(드래그)효과를 비활성시킨다.
코딩 결과
https://jsbin.com/nogesem/edit?html,css,js,output
몇시간 투자한 것이 아까워서 공유합니다.
필요한 분에게 도움이 되었으면 합니다.
댓글 4개
게시글 목록
| 번호 | 제목 |
|---|---|
| 1291 | |
| 1283 | |
| 1274 | |
| 1264 | |
| 1261 | |
| 1258 | |
| 1255 | |
| 1247 | |
| 1244 | |
| 1237 | |
| 1232 | |
| 1220 | |
| 1213 | |
| 1202 | |
| 1195 | |
| 1192 | |
| 1191 | |
| 1182 | |
| 1169 | |
| 1160 | |
| 1158 | |
| 1156 | |
| 1154 | |
| 1152 | |
| 1136 | |
| 1129 | |
| 1122 | |
| 1112 | |
| 1084 | |
| 1074 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기