我正在为 Android 设备开发一款 HTML5 游戏应用。在那场比赛中,我使用简单的倒计时方法和 setInterval 方法,我在计时器 div 中显示该计数器。当我使 div 元素位置固定时,每当我触摸屏幕时,倒计时就不会运行,然后只会开始和停止倒计时。但这在绝对位置上运行良好,我不想让那个 div 成为绝对位置。我已经尝试了所有的可能性,没有运气 请任何人帮我解决这个问题
这是我的代码
HTML:
<div id="time">
<p id="txt2"></p>
</div>
CSS:
#time {
right: 150px;
top: 11px;
z-index: 999;
position: fixed;
font-size: 30px;
color: rgb(0, 0, 0);
font-weight: bold;
font-size: 30px;
color: #FFFFFF;
}
JS:
function timedCount(){
sec = 119 - c;
document.getElementById("txt2").innerHTML = sec;
c=c+1;
tt=setTimeout(function(){
timedCount()
},10000);
}
function doTimer(){
//alert("TImer starts");
if (!timer_is_on){
timer_is_on=1;
timedCount();
}
}
function stopCount(){
//alert("Timer stops");
clearTimeout(tt);
timer_is_on=0;
//c = 0;
}
请检查我提到的这个http://www.w3schools.com/js/tryit.asp?filename=tryjs_timing_stop
最佳答案
用 jquery 试试这个
<!DOCTYPE html>
<html>
<head>
<style>
#time {
right: 150px;
top: 11px;
z-index: 999;
position: fixed;
font-size: 30px;
color: rgb(0, 0, 0);
font-weight: bold;
font-size: 30px;
color: red;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
var c=1, timer_is_on = 0, tt;
$(document).ready(function(){
doTimer();
function doTimer() {
if (!timer_is_on){
timer_is_on=1;
timedCount();
}
}
function timedCount() {
var sec = 119 - c;
$("#txt2").html(sec);
//alert(c);
c = c + 1;
tt = setTimeout(function () {
timedCount()
}, 10000);
}
function stopCount() {
//alert("Timer stops");
clearTimeout(tt);
timer_is_on = 0;
//c = 0;
}
});
</script>
</head>
<body>
<div id="time">
<p id="txt2"></p>
</div>
</body>
</html>
检查这个 link
关于javascript - 计时器在固定位置不倒计时,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21012938/