You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
41 lines
782 B
41 lines
782 B
const body = document.body
|
|
const slides = document.querySelectorAll('.slide')
|
|
const leftBtn = document.getElementById('left')
|
|
const rightBtn = document.getElementById('right')
|
|
|
|
let activeSlide = 0
|
|
|
|
rightBtn.addEventListener('click', () => {
|
|
activeSlide++
|
|
|
|
if (activeSlide > slides.length - 1) {
|
|
activeSlide = 0
|
|
}
|
|
|
|
setBgToBody()
|
|
setActiveSlide()
|
|
})
|
|
|
|
leftBtn.addEventListener('click', () => {
|
|
activeSlide--
|
|
|
|
if (activeSlide < 0) {
|
|
activeSlide = slides.length - 1
|
|
}
|
|
|
|
setBgToBody()
|
|
setActiveSlide()
|
|
})
|
|
|
|
setBgToBody()
|
|
|
|
function setBgToBody() {
|
|
body.style.backgroundImage = slides[activeSlide].style.backgroundImage
|
|
}
|
|
|
|
function setActiveSlide() {
|
|
slides.forEach((slide) => slide.classList.remove('active'))
|
|
|
|
slides[activeSlide].classList.add('active')
|
|
}
|