how to change background color on scroll

Solutions on MaxInterview for how to change background color on scroll by the best coders in the world

showing results for - "how to change background color on scroll"
Andrea
09 Jan 2017
1const [red, green, blue] = [69, 111, 225]
2const section1 = document.querySelector('.section1')
3
4window.addEventListener('scroll', () => {
5  let y = 1 + (window.scrollY || window.pageYOffset) / 150
6  y = y < 1 ? 1 : y // ensure y is always >= 1 (due to Safari's elastic scroll)
7  const [r, g, b] = [red/y, green/y, blue/y].map(Math.round)
8  section1.style.backgroundColor = `rgb(${r}, ${g}, ${b})`
9})
10
similar questions
queries leading to this page
how to change background color on scroll