$("#down").click(function(){
$("#move").animate({top:'+=75px'}, 160, 'linear')
});
$("#up").click(function(){
$("#move").animate({top:'-=75px'}, 160, 'linear')
});
function game(){
var a = [0,10,15,20,25,35,40,45,50,55,62];
var b = Math.floor(Math.random() * a.length);
var c = a[b];
$("#box").animate({right: '+=100%'}, 1000, 'linear');
$("#box").animate({right: '-=100%'}, 10);
$("#box").animate({top: c+'%'}, 0);
};
var timer;
$("#start").on('click', function(){timer = setInterval(game,1000)})
$("#stop").on('click', function(){clearInterval(timer)})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<html>
<head>
<style>
.move {
border: 1px solid black;
position: absolute;
left: 50px; top: 40%;
height: 40px; width: 40px;
background-color: rgb(0,255,100);
}
.box {
border: 1px solid black;
position: absolute;
right: 0%; top: 26%;
height: 38%; width: 2.2%;
background-color: red
}
</style>
</head>
<body>
<div id = everything class = everything>
<div class = move id = move></div>
<div class = box id = box></div>
<button id = start>Start</button>
<button id = stop>Stop</button>
<button id = down>DOWN</button>
<button id = up>UP</button>
</div>
我正在使用此计时器来构建简单的游戏时遇到问题。我要循环播放的函数是function game()
,它使div“框”在屏幕的最右边初始化,一直动画到屏幕的最左边,然后立即返回最右边。 。从本质上讲,它会给玩家带来障碍的幻觉。单击按钮“开始”设置间隔。单击“停止”应将其清除。
如果我想设置间隔的时间,我知道我必须更改setInterval(game, x)
中的第二个值,但是当我给出值x时,只有第一个实例延迟了该数量,然后功能循环无延迟。我的函数或setInterval的执行有什么问题?您对改善我实现上述目标的方法有何建议?
此外,我的clearInterval(timer)
有时仅工作,大部分时间间隔较长。函数中是否发生了太多的事情,程序无法在短时间内清除间隔?感谢您的帮助。
答案 0 :(得分:1)
我建议您使用s = pd.to_numeric(df[0], errors='coerce')
df[0] = s.where(s.isin(range(2010, 2020)))
print (df)
0 1
0 NaN Banks
1 NaN Axis Bank
2 NaN ICICI
3 NaN PNB
4 2010.0 KYB
5 NaN Indus Ind
6 NaN Karur
仍在下面的答案中
1)使用requestAnimationFrame
以较小的间隔停止动画。
2)还要在$().finish()
中使用clearInterval(timer)
,就好像您多次单击开始一样。
start
$("#down").click(function(){
$("#move").animate({top:'+=75px'}, 160, 'linear')
});
$("#up").click(function(){
$("#move").animate({top:'-=75px'}, 160, 'linear')
});
function game(){
var a = [0,10,15,20,25,35,40,45,50,55,62];
var b = Math.floor(Math.random() * a.length);
var c = a[b];
$("#box").animate({right: '+=100%'}, 1000, 'linear');
$("#box").animate({right: '-=100%'}, 10);
$("#box").animate({top: c+'%'}, 0);
};
var timer;
$("#start").on('click', function(){game();clearInterval(timer); timer = setInterval(game,1000)})
$("#stop").on('click', function(){
$("#box").finish();
clearInterval(timer)
})