
// slider06 const sliderWrap = document.querySelector(".slider__wrap"); //sliderWrap에 div 태그 .slider__wrap 저장 const sliderImg = document.querySelector(".slider__img"); //sliderImg에 div 태그 .slider_img 저장, 이미지 한 칸만 보이는 영역 const sliderInner = document.querySelector(".slider__inner"); //이미지 움직이는 영역 const slider = document.querySelectorAll(".slider"); const sliderBtn = document.querySelector(".slider..

// slider05 const sliderWrap = document.querySelector(".slider__wrap"); //sliderWrap에 div 태그 .slider__wrap 저장 const sliderImg = document.querySelector(".slider__img"); //sliderImg에 div 태그 .slider_img 저장, 이미지 한 칸만 보이는 영역 const sliderInner = document.querySelector(".slider__inner"); //이미지 움직이는 영역 const slider = document.querySelectorAll(".slider"); //slider에 div 태그 .slider (최종적으로 이미지를 담는 다섯개의 div)..

// slider04 const sliderWrap = document.querySelector(".slider__wrap"); const sliderImg = document.querySelector(".slider__img"); // 이미지 보이는 영역 const sliderInner = document.querySelector(".slider__inner"); // 이미지 움직이는 구간 const slider = document.querySelectorAll(".slider"); // 5개의 이미지 let currentIndex = 0; let sliderCount = slider.length; // 이미지 갯수 let sliderHeight = sliderImg.offsetHeight // sli..

// slider03 const sliderWrap = document.querySelector(".slider__wrap"); const sliderImg = document.querySelector(".slider__img"); //이미지 보이는 영역 const sliderInner = document.querySelector(".slider__inner"); //이미지 움직이는 영역 const slider = document.querySelectorAll(".slider"); //5개의 이미지 저장 let currentIndex = 0; //첫 번째 이미지(현재 보이는 이미지) let sliderCount = slider.length; //이미지 갯수 let sliderWidth = sliderIm..

// slider02 const sliderWrap = document.querySelector(".slider__wrap"); const sliderImg = document.querySelector(".slider__img"); //이미지 보이는 영역 const sliderInner = document.querySelector(".slider__inner"); //이미지 움직이는 영역 const slider = document.querySelectorAll(".slider"); //5개의 이미지 저장 let currentIndex = -1; //첫 번째 이미지(현재 보이는 이미지) let sliderCount = slider.length; //이미지 갯수 setInterval(()=>{ console..

//setInteval //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... 5로 나눠서 나머지 값만 나오게. slider[currentIndex].style..