[英]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.