(Javascript / jQuery) Swiper 슬라이더 응용 - 페이지 변경시 좌우 이동버튼 텍스트 변경 (Swiper navigation text change) - loop가 아닐경우

swiper.js

See the Pen Swiper Slide - 페이지 변경시 좌우 이동버튼 텍스트 변경 (Swiper navigation text change) -not loop by kimyangsun (@kimyangsun) on CodePen.

 

바로 이전에 올린 글과 같은 기능을 구현한 코드입니다.

차이점은 이전글이 loop가 true인 코드라면 이번꺼는 loop가 false인 코드입니다.

해당 코드는 첫페이지나 마지막페이지에 갔을때 이전 인덱스와 다음 인덱스가 없기 때문에

해당 부분에서 오류가 나지않도록 적용했습니다. 추가로 첫 페이지일때는 이전으로 가는 버튼을 숨겨주고

마지막 버튼일때는 다음으로 가는 버튼을 숨겨주는 기능도 추가했습니다. (loop가 false이기 때문)

 

자세한 코드 내용은 상단 코드펜에 들어가셔서 확인하시면 됩니다.