Javascript 修复动画属性
我正在做一些研究,为小学生们创造一个新的数学游戏,在这个游戏中,0-9的div随机出现在一个容器中 开头有一个问题。大概是20的倍数。然后,用户必须单击正确的选项,最后将对它们进行计数并给出分数 我刚刚改变了div的显示速度,使它们的显示时间更长,一次可以显示多个div,从而使年幼的孩子更容易玩游戏 我像这样用了“fadeIn”Javascript 修复动画属性,javascript,jquery,Javascript,Jquery,我正在做一些研究,为小学生们创造一个新的数学游戏,在这个游戏中,0-9的div随机出现在一个容器中 开头有一个问题。大概是20的倍数。然后,用户必须单击正确的选项,最后将对它们进行计数并给出分数 我刚刚改变了div的显示速度,使它们的显示时间更长,一次可以显示多个div,从而使年幼的孩子更容易玩游戏 我像这样用了“fadeIn” $('#' + id).animate({ top: newY, left: newX }, 'slow', funct
$('#' + id).animate({
top: newY,
left: newX
}, 'slow', function() {}).fadeIn(2000);
}
我的问题是,现在当我拍摄正确或不正确的数字时,动画非常容易出错,我不知道为什么
Fiddle:(查看版本5以了解以前的情况)在startplay()
内部,在调用scramble()
时控制并发性,我使用名为window.cont的全局变量来执行此操作,因此我替换了以下调用:
play = setInterval(scramble, 1800);
对于这一个:
play = setInterval(function() {
if (window.cont){
window.cont = false;
scramble();
}
}, 1000);
varwindow.cont
需要在代码开头全局设置,如下所示:
var miss = 0;
var hit = 0;
var target = $("#target");
window.cont = true;
$('#'+id).css({
top: newY,
left: newX
}).fadeIn(2000, function() {
setTimeout(function() {
$('#' + id).slideUp('fast');
window.cont = true;
}, 1500);
});
因此,使用window.cont
您现在可以控制动画一个接一个地执行,而不会重叠,如下所示:
var miss = 0;
var hit = 0;
var target = $("#target");
window.cont = true;
$('#'+id).css({
top: newY,
left: newX
}).fadeIn(2000, function() {
setTimeout(function() {
$('#' + id).slideUp('fast');
window.cont = true;
}, 1500);
});
请看《工作》这正是我想要的,但我也希望Div能同时出现,你知道怎么做吗@内尔索纳特在同一时间?所有的10个div?这将需要从您的原始代码中进行更多的重构。不,只是为了使它们在时间上重叠,所以有1个以上@Nelson@Milo-J有关同时显示两个div的版本,请参见。您可以将window.cont var调整为同时显示3或4。太好了,谢谢。我将接受你的回答我只是想知道你是否可以把它用来聊天和讨论另一个问题?这与第n个孩子的赔率和平均数有关@Nelson