Lpla 개발 블로그

menu-opener icon
  • HTML&CSS
  • JavaScript/기초
  • JavaScript/실전
  • React
  • PHP
  • 그누보드
  • ETC
반응형
Swiper 예제 - 첫번째 슬라이드에서 prev 기능 막기 포스팅 썸네일 이미지

JavaScript/실전

Swiper 예제 - 첫번째 슬라이드에서 prev 기능 막기

1. 기본 구조 1 2 3 4 5 6 7 Swiper에서 loop 기능을 사용하지 않으면 첫번째 슬라이드에서 prev 버튼이 자동적으로 비활성화된다. 마찬가지로 마지막 슬라이드에서 next 버튼도 비활성화된다. 한편 loop 기능을 사용하게 되면 첫번째 슬라이드에도 이전 슬라이드가 존재하고, 마지막 슬라이드 다음에도 슬라이드가 존재하기 때문에 버튼이 항상 활성화되어 있다. 말 그대로 루프(반복)니까 당연한 현상이다. 그런데 사용자에 따라서 loop 기능을 사용하되 첫번째 슬라이드에서 prev 버튼을 비활성화하고 싶을 수 있다. 첫번째 슬라이드에서 마지막 슬라이드로 되돌아가는 것이 마음에 들지 않을 수도 있으니까. 이제 해결 방법에 대해 알아보자. 2. reachBeginning, reachEnd Swip..

2021.11.06 게시됨

1
반응형

최근글

인기글

반응형
07-20 07:28

활동 내역

«   2025/07   »
일 월 화 수 목 금 토
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 31

태그 클라우드

  • gsap
  • 자바스크립트
  • 영화 웹서비스 만들기
  • 파이썬
  • swiper
  • css
  • 리액트
  • React
  • 노마드코더
  • 그누보드
Copyright . lpla all rights reserved.
Designed by 베이스캠프
닫기 아이콘
사이드 프로필 배경이미지
블로그 이미지

Lpla

자기개발 블로그입니다. (2019.07.15~)

  • 분류 전체보기 (156)
    • 일상 (9)
    • HTML&CSS (16)
    • JavaScript (78)
      • 기초 (34)
      • 실전 (44)
    • React (9)
    • PHP (6)
    • 그누보드 (10)
    • Python (9)
    • WordPress (4)
    • etc (10)
    • 웹디자인기능사 (5)

전체

오늘

어제

Designed by 베이스캠프

티스토리툴바