код :
const [red, green, blue] = [69, 111, 225]
const section1 = document.querySelector('.section1')
window.addEventListener('scroll', () => {
let y = 1 + (window.scrollY || window.pageYOffset) / 150
y = y < 1 ? 1 : y // ensure y is always >= 1 (due to Safari's elastic scroll)
const [r, g, b] = [red/y, green/y, blue/y].map(Math.round)
section1.style.backgroundColor = rgb(${r}, ${g}, ${b})
})
backgroundColor хранить в стейте через useState, обработчик вешать (и удалять) в useEffect, там же вызывать изменение стейта и в рендере использовать inline-стиль
Обсуждают сегодня