Quiz

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • H
소스 보기
Javascript
HTML
CSS
{
// 자바스크립트가 잴 마지막에 실행되도록
window.onload = function(){
let currentIndex = 0; // 현재 이미지
const slider = document.querySelectorAll(".slider"); // 모든 이미지 변수 저장

// 이미지 변경
setInterval(() => { // 3초에 한번씩 실행
    let nextIndex = (currentIndex + 1) % slider.length ;
    // 첫번째 이미지가 사라짐
    slider[currentIndex].style.opacity = "0";
    slider[nextIndex].style.opacity = "1";  
    slider.forEach(img => img.style.transition = "all 3s");
    
    currentIndex = nextIndex; // 두번 째 인덱스 값을 현재 인덱스 값에 저장       
}, 3000)
}
}
HTML
CSS
danziro97@naver.com