[英]Math.Random - Javascript
我有这个代码:
var num = 550;
$(document).keydown(function (event) {
switch (event.keyCode) {
// Left Arrow
case 37: num = num-- - 15;
document.getElementById('player').style.margin = '550px ' + num + 'px 0px ';
break;
// Right Arrow
case 39: num = 15 + num++;
document.getElementById('player').style.margin = '550px ' + num + 'px 0px ';
break;
}
});
var nump = 0;
var touch = false;
var flagtouch;
$(document).ready(function () {
flagtouch = setInterval(function () {
movePoint(nump);
}, 10);
});
function movePoint() {
document.getElementById('point').style.margin = nump + 'px 615px 0px';
touch = chekTouch($('#point'), $('#player')) // check whether the divs touches and return true if touched
if (touch) {
$('.point').ready(function () {
var docWidth = $(document).width();
var $div = $('.point');
var divWidth = $div.width();
var widthMax = docWidth - divWidth;
$div.css({
marginLeft: Math.floor(Math.random() * widthMax),
marginTop: 150,
});
});
}
else {
nump++;
}
}
function chekTouch($div1, $div2) {
var x1 = $div1.offset().left;
var y1 = $div1.offset().top;
var h1 = $div1.outerHeight();
var w1 = $div1.outerWidth();
var b1 = y1 + h1;
var r1 = x1 + w1;
var x2 = $div2.offset().left;
var y2 = $div2.offset().top;
var h2 = $div2.outerHeight();
var w2 = $div2.outerWidth();
var b2 = y2 + h2;
var r2 = x2 + w2;
if (b1 < y2 || y1 > b2 || r1 < x2 || x1 > r2) return false;
return true;
}
现在,我得到了这个触摸功能,当div 点触及div 玩家时,他以随机方式执行marginLeft并且marginTop为0px。
因此它的工作只有1个问题,随机并没有停止工作,当div有物理接触时,他继续移动。
我的问题是,只有当他触摸div时,我如何才能使随机保证金工作?
谢谢!
// - 这是因为你使用的setInterval每隔10ms就会播放一次
编辑:
对不起,我误解了你的意思,
触摸后你应该清除这样的间隔:
clearInterval(flagtouch);
然后循环将停止
在movePoint()
,当你设置随机设置touch
为真时的边距后,你仍然用document.getElementById('point').style.margin = nump + 'px 615px 0px';
设置边距document.getElementById('point').style.margin = nump + 'px 615px 0px';
在每个间隔,但不增加nump
,所以之后touch
将永远是真的 。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.