[英]Making divs constantly move randomly
我为孩子们制作了射击游戏,他们必须在出现时射击正确的数字(取决于问题)。 我的问题是此刻数字一次出现一次,但我想这样做,以便画布上不断填充数字,这些数字会像本例中的形状一样不断移动... http://sheppardsoftware.com/ mathgames / earlymath / shapes_shoot.htm
function moveRandom(id) {
var cPos = $('#container').offset();
var cHeight = $('#container').height();
var cWidth = $('#container').width();
// get box padding (assume all padding have same value)
var pad = parseInt($('#container').css('padding-top').replace('px', ''));
// get movable box size
var bHeight = $('#' + id).height();
var bWidth = $('#' + id).width();
// set maximum position
maxY = cPos.top + cHeight - bHeight - pad;
maxX = cPos.left + cWidth - bWidth - pad;
// set minimum position
minY = cPos.top + pad;
minX = cPos.left + pad;
// set new position
newY = randomFromTo(minY, maxY);
newX = randomFromTo(minX, maxX);
$('#' + id).css({
top: newY,
left: newX
}).fadeIn(2000, function() {
setTimeout(function() {
$('#' + id).fadeOut('fast');
window.cont++;
}, 1500);
});
这是我创建的版本http://jsfiddle.net/pUwKb/5/
如果将css()
方法替换为animate()
,是否可行?
$('#' + id).animate({
top: newY,
left: newX
}).fadeIn(2000, function() {
setTimeout(function() {
$('#' + id).fadeOut('fast');
window.cont++;
}, 1500);
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.