125 lines
3.4 KiB
JavaScript
125 lines
3.4 KiB
JavaScript
var body = $("body"),
|
|
people = $(".people"),
|
|
clientWidth = document.body.clientWidth,
|
|
clientHeight = document.body.clientHeight,
|
|
totalNums = 0;
|
|
|
|
body.onmousemove = function(e) {
|
|
var x = e.x,
|
|
moveX = x - 100;
|
|
people.style.left = `${moveX < 0 ? 0 : moveX}px`;
|
|
|
|
|
|
if (moveX > clientWidth / 2) {
|
|
people.classList.remove("right")
|
|
|
|
} else {
|
|
people.classList.add("right")
|
|
}
|
|
}
|
|
|
|
function CreatedResources(type) {
|
|
var x = parseInt(Math.random() * clientWidth) - (type == 'apple' ? 40 : 60);
|
|
x < 0 ? x = 0 : x;
|
|
|
|
var apple = document.createElement("img");
|
|
apple.src = type == "apple" ? "./img/apple.png" : "./img/boom.png";
|
|
apple.className = type == "apple" ? "apple motion" : "boom motion";
|
|
apple.style.left = `${x}px`;
|
|
apple.style.top = `${type == 'apple'? -40 : -60}px`;
|
|
body.appendChild(apple);
|
|
motion(apple, type)
|
|
}
|
|
|
|
function motion(el, type) {
|
|
var apple = 0,
|
|
bmob = 0
|
|
if (type == "apple") {
|
|
apple = setInterval(() => {
|
|
el.style.top = `${parseInt(el.style.top) + 30}px`;
|
|
if (parseInt(el.style.top) > clientHeight) {
|
|
body.removeChild(el)
|
|
clearInterval(apple)
|
|
} else {
|
|
JudgingCollision(el, apple)
|
|
}
|
|
}, 60)
|
|
|
|
} else {
|
|
bmob = setInterval(() => {
|
|
el.style.top = `${parseInt(el.style.top) + 50}px`;
|
|
if (parseInt(el.style.top) > clientHeight) {
|
|
setTimeout(() => {
|
|
try {
|
|
body.removeChild(el)
|
|
clearInterval(bmob)
|
|
} catch (e) {}
|
|
|
|
}, 500)
|
|
} else {
|
|
JudgingCollision(el, bmob)
|
|
}
|
|
}, 80)
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
function JudgingCollision(span, timeout) {
|
|
var people = $(".people");
|
|
var peopleX1 = parseInt(people.style.left);
|
|
var peopleX2 = parseInt(people.style.left) + people.clientWidth;
|
|
var peopleX3 = people.offsetTop;
|
|
var peopleX4 = people.offsetTop + people.clientHeight;
|
|
var spanX1 = parseInt(span.style.left);
|
|
var spanX2 = parseInt(span.style.left) + span.clientWidth;
|
|
var spanX3 = parseInt(span.style.top);
|
|
var spanX4 = parseInt(span.style.top) + span.clientHeight;
|
|
|
|
|
|
if (peopleX4 < spanX3 || peopleX1 > spanX2 || peopleX3 > spanX4 || peopleX2 < spanX1) {} else {
|
|
if (span.classList.contains("apple")) {
|
|
console.log("苹果");
|
|
totalNums += 30;
|
|
$(".appleaudio").play()
|
|
$(".totalNums").innerText = `${totalNums}分`
|
|
setTimeout(() => {
|
|
body.removeChild(span)
|
|
clearInterval(timeout)
|
|
}, 540)
|
|
} else {
|
|
totalNums -= 40;
|
|
span.src = "./img/bombimg.png"
|
|
$(".boomaudio").play()
|
|
$(".totalNums").innerText = `${totalNums}分`
|
|
setTimeout(() => {
|
|
body.removeChild(span)
|
|
clearInterval(timeout)
|
|
}, 540)
|
|
console.log("炸弹")
|
|
}
|
|
}
|
|
}
|
|
|
|
function Created() {
|
|
var random = parseInt(Math.random() * 100);
|
|
if (random <= 80) {
|
|
CreatedResources("bomb")
|
|
console.log("生成炸弹")
|
|
} else {
|
|
CreatedResources("apple")
|
|
console.log("生成苹果")
|
|
}
|
|
}
|
|
|
|
setInterval(() => {
|
|
Created();
|
|
}, 1000)
|
|
|
|
|
|
function $(className) {
|
|
return document.querySelector(className)
|
|
} |