大家好，又见面了，我是你们的朋友全栈君。
var box = document.querySelector(“#box”);
var content = document.querySelector(“#content”);
var shadow = document.querySelector(“#shadow”);
var tip = document.querySelector(“#tip”);
var block = document.querySelector(“#block”);
var maxWidth = content.clientWidth – shadow.offsetWidth
var maxHeight = content.clientHeight – shadow.offsetHeight;
var ranX = Math.round(Math.random() * maxWidth);
var ranY = Math.round(Math.random() * maxHeight);
shadow.style.left = ranX + “px”;
shadow.style.top = ranY + “px”;
tip.style.top = ranY + “px”;
tip.style.backgroundPosition = -ranX + “px ” + (-ranY) + “px”;
block.onmousedown = function(e) {
var ev = event || e;
var startX = ev.x;
document.onmousemove = function(e) {
var ev = event || e;
var x = ev.x;
var left = x – startX;
if (left <= 0) {
left = 0;
}
if (left >= maxWidth) {
left = maxWidth;
}
block.style.left = left + “px”;
tip.style.left = left + “px”;
}
}
document.onmouseup = function() {
document.onmousemove = null;
if (Math.abs(tip.offsetLeft – shadow.offsetLeft) <= 2) {
alert(“成功”);
} else {
block.style.left = 0;
tip.style.left = 0;
add();
}
}
function add() {
var ranX = Math.round(Math.random() * maxWidth);
var ranY = Math.round(Math.random() * maxHeight);
shadow.style.left = ranX + “px”;
shadow.style.top = ranY + “px”;
tip.style.top = ranY + “px”;
tip.style.backgroundPosition = -ranX + “px ” + (-ranY) + “px”;
}
window.ondragstart = function() {
return false;
}
发布者：全栈程序员-用户IM，转载请注明出处：https://javaforall.cn/150566.html原文链接：https://javaforall.cn
【正版授权，激活自己账号】： Jetbrains全家桶Ide使用，1年售后保障，每天仅需1毛
【官方授权 正版激活】： 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...
