![](http://i1.daumcdn.net/thumb/T650x650/?fname=https://blog.kakaocdn.net/dn/zYGTm/btrzBIX6LkA/4nopC8rs2KnW6D6hVHDtR0/img.png)
{ const sliderWrap = document.querySelector(".slider__wrap") const sliderImg = document.querySelector(".slider__img") //이미지 보이는 영역 const sliderInner = document.querySelector(".slider__inner") //이미지 움직이는 전체 영역 const slider = document.querySelectorAll(".slider") //슬라이드 이미지 const sliderBtn = document.querySelector(".slider__btn") //버튼 const sliderBtnPrev = sliderBtn.querySelector(".prev") //이전 버튼 c..
![](http://i1.daumcdn.net/thumb/T650x650/?fname=https://blog.kakaocdn.net/dn/cRxqkF/btrzyYnjXdb/xlJPTgdkdAmFmuKZSdEG4K/img.png)
{ const sliderWrap = document.querySelector(".slider__wrap") const sliderImg = document.querySelector(".slider__img") //이미지 보이는 영역 const sliderInner = document.querySelector(".slider__inner") //이미지 움직이는 전체 영역 const slider = document.querySelectorAll(".slider") //슬라이드 이미지 const sliderBtn = document.querySelector(".slider__btn") //버튼 const sliderBtnPrev = sliderBtn.querySelector(".prev") //이전 버튼 c..
![](http://i1.daumcdn.net/thumb/T650x650/?fname=https://blog.kakaocdn.net/dn/b7wm02/btrtMJvCPC1/V95L1GlXzd2LphAjkJmMhk/img.png)
{ const sliderWrap = document.querySelector(".slider__wrap") const sliderImg = document.querySelector(".slider__img") //이미지 보이는 영역 const sliderInner = document.querySelector(".slider__inner") //이미지 움직이는 영역 const slider = document.querySelectorAll(".slider") const sliderBtn = document.querySelector(".slider__btn") //버튼 const sliderDot = document.querySelector(".slider__dot") //dot 버튼 let currentI..
![](http://i1.daumcdn.net/thumb/T650x650/?fname=https://blog.kakaocdn.net/dn/5CHLV/btrtKDilNqd/VrPK5BSJee1VrPCkP4jCY1/img.png)
{ const sliderWrap = document.querySelector(".slider__wrap") //슬라이드 전체 영역 const sliderImg = document.querySelector(".slider__img") //이미지 보이는 영역 const sliderInner = document.querySelector(".slider__inner") //이미지 움직이는 영역 const slider = document.querySelectorAll(".slider") const sliderBtn = document.querySelector(".slider__btn") //버튼 const sliderBtnPrev = sliderBtn.querySelector(".prev") //뒤로 const..
![](http://i1.daumcdn.net/thumb/T650x650/?fname=https://blog.kakaocdn.net/dn/bdYc2h/btrtEv6EPe0/P4fXVgAKoE7uqbDO6a3Oq1/img.png)
{ const sliderWrap = document.querySelector(".slider__wrap") const sliderImg = document.querySelector(".slider__img") //이미지 보이는 영역 const sliderInner = document.querySelector(".slider__inner") //이미지 움직이는 영역 const slider = document.querySelectorAll(".slider") let currentIndex = 0; let sliderCount = slider.length; //이미지 갯수 let sliderHeight = sliderImg.offsetHeight; //이미지 가로값 let sliderClone = slide..
![](http://i1.daumcdn.net/thumb/T650x650/?fname=https://blog.kakaocdn.net/dn/q70OZ/btrtoAHeyWl/oNAKGwVZIoPUOWfsdOiv2k/img.png)
{ const sliderWrap = document.querySelector(".slider__wrap") const sliderImg = document.querySelector(".slider__img") //이미지 보이는 영역 const sliderInner = document.querySelector(".slider__inner") //이미지 움직이는 영역 const slider = document.querySelectorAll(".slider") let currentIndex = 0; let sliderCount = slider.length; //이미지 갯수 let sliderWidth = sliderImg.offsetWidth; //이미지 가로값 let sliderClone = sliderI..
![](http://i1.daumcdn.net/thumb/T650x650/?fname=https://blog.kakaocdn.net/dn/cND8pd/btrtt4z39NO/aX43RmVHQckUJK1Iaca91K/img.png)
{ const sliderWrap = document.querySelector(".slider__wrap") const sliderImg = document.querySelector(".slider__img") //이미지 보이는 영역 const sliderInner = document.querySelector(".slider__inner") //이미지 움직이는 영역 const slider = document.querySelectorAll(".slider") let currentIndex = -1; //첫 번째 이미지(현재 보이는 이미지) let sliderCount = slider.length //이미지 갯수 setInterval(()=>{ (currentIndex < sliderCount - 1) ? ..
![](http://i1.daumcdn.net/thumb/T650x650/?fname=https://blog.kakaocdn.net/dn/cCT8b5/btrtsULarAP/A6ZFgWNvsLkQ9YDZy0ZhX1/img.png)
{ // slider01 const sliderWrap = document.querySelector(".slider__wrap") const sliderImg = document.querySelector(".slider__img") const slider = document.querySelectorAll(".slider") let currentIndex = 0; //현재 보이는 이미지 let sliderCount = slider.length; //이미지 갯수 setInterval(() => { //함수를 반복적으로 실행시키고싶을때 씀 let nextIndex = (currentIndex + 1) % 5; //1 2 3 4 0 1 2 3 4 0 되도록 1%(나머지) 5를 써서 slider[currentIn..