-
Notifications
You must be signed in to change notification settings - Fork 0
/
app.js
32 lines (24 loc) · 855 Bytes
/
app.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
const container = document.getElementById('container')
const colors = ['#e74c3c', '#8e44ad', '#3498db', '#e67e22', '#2ecc71']
const SQUARES = 500
for (let i = 0; i < SQUARES; i++) {
const square = document.createElement('div')
square.classList.add('square')
square.addEventListener('mouseover', () => setColor(square))
square.addEventListener('mouseout', () => removeColor(square))
container.appendChild(square)
}
function setColor(div) {
//console.log(div)
const randomColor = getRandomColor()
div.style.backgroundColor = randomColor
div.style.boxShadow = `0 0 2px ${randomColor}, 0 0 10px ${randomColor}`
}
function getRandomColor() {
return colors[Math.floor(Math.random() * colors.length)]
}
function removeColor(div) {
//console.log('remove')
div.style.backgroundColor = '#111'
div.style.boxShadow = '0 0 2px #000'
}