<html>
<head>
<meta charset=UTF-8>
<title>Yugi</title>
<style>
*{
margin:0
padding:0
}
</style>
<script>
var Yugi = function(w, h, v)
{
this.w = w
this.h = h
this.v = v
}
Yugi.prototype = new Yugi
Yugi.prototype.constructor = Yugi
Yugi.pointToPoint = function(a, b) {
return Math.sqrt(Math.pow(a[0] - b[0], 2) + Math.pow(a[1] - b[1], 2))
}
Yugi.pointToAngle = function(origin, point) {
var PI = Math.PI
if (point[0] == origin[0]) {
if (point[1] > origin[1])
return PI * 0.5
return PI * 1.5
} else if (point[1] == origin[1]) {
if (point[0] > origin[0])
return 0
return PI
}
var t = Math.atan((origin[1] - point[1]) / (origin[0] - point[0]) * 1)
if (point[0] > origin[0] && point[1] < origin[1])
return t + 2 * PI
if (point[0] > origin[0] && point[1] > origin[1])
return t
return t + PI
}
Yugi.prototype.create = function(e, _sX, _sY)
{
var div = document.createElement("div")
div.style.position = "absolute"
div.style.cursor = "pointer"
div.style.width = this.w + "px"
div.style.height = this.h + "px"
var L = e.clientX + _sX - this.w / 2, T = e.clientY + _sY - this.h / 2
div.style.left = L + "px"
div.style.top = T + "px"
div.style.backgroundColor = "red"
document.body.appendChild(div)
this.elem = div
this.currPoint = [L, T]
}
Yugi.prototype.move = function(e, _sX, _sY)
{
var me = this, x = e.clientX + _sX - me.w / 2, y = e.clientY + _sY - me.h / 2
var newPoint = [x, y]
var sleep = 20, speed = me.v / sleep
me.interval && clearInterval(me.interval)
me.interval = setInterval(function() {
var len = Yugi.pointToPoint(me.currPoint, newPoint)
if (len < 1) {
clearInterval(me.interval)
me.interval = 0
} else {
var angle = Yugi.pointToAngle(me.currPoint, newPoint)
me.currPoint = [me.currPoint[0] + Math.cos(angle) * Math.min(len / 2, speed), me.currPoint[1] + Math.sin(angle) * Math.min(len / 2, speed)]
me.elem.style.left = me.currPoint[0] + 'px'
me.elem.style.top = me.currPoint[1] + 'px'
}
}, sleep)
}
var yugi = new Yugi(30, 30, 500)
document.onclick = function(e)
{
e = e || window.event
var _sX = window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft
var _sY = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
var me = yugi
if (!me.elem) {
me.create(e, _sX, _sY)
}
else {
if (!me.interval) {
var cloned = document.createElement("div")
cloned.innerHTML = me.elem.outerHTML
document.body.appendChild(cloned.children[0])
}
me.move(e, _sX, _sY)
}
}
document.oncontextmenu = new Function("return false")
</script>
</head>
<body></body>
</html>
1、先根据id获取对象
document.getElementById("pro")2、然后 使用该对象的 .innerHTML 属性往该节点中插入
document.getElementById("pro").innerHTML="<div>*****</div>"3、使用for循环。
4、结束，实现方法很多。编程学的不是代码，而是思想。
1、幸运方块只能自己亲手去做。
2、首先想要制作幸运方块必须使用js或者addons才能实现。
3、在该js中，幸运方块的制作方式是九个红石粉末。
4、在不同的插件中会有不同的合成方法，在addons中则是修改原有物品实现幸运方块功能，合成方法和原物品一样。
5、真正的大神可以使用红石电路模拟幸运方块的功能。
