이 튜토리얼에서는 처음부터 Vue.js를 사용하여 Carousel 이미지 슬라이더를 만드는 방법을 보여 드리겠습니다. Carousel을 사용하면 일련의 이미지를 자동으로 순환할 수 있습니다.
또한 사용자가 수동으로 컨트롤을 눌러 이전 또는 다음 이미지로 전환할 수 있도록 캐러셀에 몇 가지 컨트롤을 추가합니다.
그 외에도 페이지에 얼마나 많은 이미지가 있는지 표시하고 어떤 이미지가 활성 상태인지 나타내는 표시기를 추가합니다. 사용자는 이를 클릭하여 현재 이미지를 전환할 수 있습니다.
파이썬의 fabs()
타임라인:
00:00 소개
00:47 프로젝트 설정
02:47 회전 목마 구성 요소 구조
05:53 기본 스타일링
06:43 전환 효과 추가
09:33 슬라이드 컨트롤 추가
17:10 슬라이드 표시기 추가
22:27 마무리 터치
소스 코드:
https://tutsprime.com/videos/build-carousel-image-slider-in-vuejs-from-scratch
구독하다: https://www.youtube.com/c/TutsPrime/featured
www.youtube.com
처음부터 Vue.js로 회전 목마 이미지 슬라이더를 만드는 방법
이 튜토리얼에서는 처음부터 Vue.js를 사용하여 Carousel 이미지 슬라이더를 만드는 방법을 보여 드리겠습니다. Carousel을 사용하면 사용자가 자동으로 순환할 수 있습니다.