Learning JavaScript basics by coding tiny apps, part 2
Let's build a "mouse precision" game
By: Ajdin Imsirovic 09 September 2019
Hereβs our complete mini appβs code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
var points = 0;
var card = document.querySelector('.card');
alert(card)
function shadow(e) {
/*
var width = card.offsetWidth;
var height = card.offsetHeight;
*/
var { offsetWidth: width, offsetHeight: height } = card;
let { offsetX: x, offsetY: y } = e;
console.log(x, y);
if(x > -5 && x < 5 && y > -5 && y < 5) {
points = points + 10;
console.log(`%c points: ${points}`, 'background: tomato; color: white')
}
}
document.body.addEventListener('mousemove', shadow);