티스토리 뷰
CDN 설정 방법
# 01:00
보안때문에 외부 연결을 못하는 경우, 플러그인을 다운받아서 사용하고, 보통은 CDN을 사용한다.
# 01:18
swiperjs.com/get-started#installation
<link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.css" />
<script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>
각각 2개의 CDN 중
- CSS는 일반 CSS를 사용한다. => 커스텀 마이징을 하기 위해서
- JS는 min 버전을 사용한다.
# 02:10
Swiper을 사용하기 위해서 제이쿼리를 사용해야 함.
# 02:30
복사한 제이쿼리 CDN을 넣을 때 Swiper CDN의 윗쪽에 넣어줘야 하고,
<link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.css" />
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>
제이쿼리 CDN의 필요없는 부분은 삭제한다.
* 삭제 -> integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"
최종 CDN
<link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.css" />
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>
'인터랙션 & 컴포넌트 > 플러그인' 카테고리의 다른 글
[swiper] 기본 설정 모두 넣은 버전 (0) | 2021.03.14 |
---|---|
[swiper] 추가 옵션 (0) | 2021.03.14 |
[swiper] 반응형 설정 (0) | 2021.03.14 |
[swiper] 접근성 - a11y (0) | 2021.03.14 |
댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크
TAG
- scrollHeight
- 링크막기 #a링크막기
- offsetTop
- 객체의 프로퍼티
- 동등 연산자
- 점 표기법
- offsetHeight
- prototype 프로퍼티
- constructor
- clientHeight
- 일치 연산자
- 불일치 연산자
- @font-face
- outerHeight
- innerHeight
- scrollTop
- clinetTop
- javascript class
- 대괄포 표기법
- property
- 동치 연산자
- 부등 연산자
- [[Prototype]]
- __proto__
- 프로퍼티
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | |
7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 | 17 | 18 | 19 | 20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 | 30 |
글 보관함