作者fillano (冒牌费大公)
看板Ajax
标题Re: [问题] 用JAVA函数控制图片出现时间
时间Tue Jan 13 00:01:18 2009
不知道你们老师要你们做的,真的是javascript吗,虽然觉得对於入门者实在有点超过。
恩,晚上试了一下做法,因为效率的关系,我用了三个setInterval来做,有一点像是
Thread:
<html>
<body>
<div id="panel">0</div>
<script>
(function(){
var a = document.getElementById("panel");
var duration = 10;
var action = [
[1, function(){a.innerHTML = '1';}],
[2, function(){a.innerHTML = '2';}],
[3, function(){a.innerHTML = '3';}],
[4, function(){a.innerHTML = '4';}],
[5, function(){a.innerHTML = '5';}],
[6, function(){a.innerHTML = '6';}],
[7, function(){a.innerHTML = '7';}],
[8, function(){a.innerHTML = '8';}],
[9, function(){a.innerHTML = '9';}]
];
var curr = start = new Date().getTime();
var timer = true;
var currTimeUpdater = window.setInterval(function(){
if(timer) {
curr = new Date().getTime();
} else {
window.clearInterval(currTimeUpdater);
}
},1);
var timerStop = window.setInterval(function(){
if ((curr - start) > duration*1000) {
timer = false;
window.clearInterval(timerStop);
}
},1);
var th = window.setInterval(function(){
if(timer) {
if(action.length>0 && (curr-start) > action[0][0]*1000) {
action[0][1]();
action.shift();
return;
}
} else {
window.clearInterval(th);
}
},1);
})();
</script>
</body>
</html>
大致上可以精确到秒。我没测试更小的时间单位,理论上你可以用千分之一秒,Date
Object的getTime()传回的也是千分之一秒,所以可以修改一下单位试试看。但是我想不
可能达到千分之一秒,而且setInterval最小也只能到千分之一秒,所以我想时间精确到
百分之一秒或更长也许比较不会出问题。
另一个问题是图片载入跟render比较耗时,所以最好用ajax的方式预载比较保险。
action阵列里面的的元素,也是一个阵列,这个阵列有固定格式,第一个是秒,第二个是
动作函数。可以用这个改来做你要的用途,例如更新图片等。
简单地说就是这样,我在firefox3.0.5、Google Chrome 1.0、Webkit nightly build
r39553、ie7测试过,应该可行。不过图片的效率我没试,你自己来吧。
--
Sapere Aude! 这就是启蒙运动的口号!
--
※ 发信站: 批踢踢实业坊(ptt.cc)
◆ From: 60.248.166.83
1F:→ fillano:用很小的图测了一下,十分之一秒大概是极限了。大图应该会 01/13 11:51
2F:→ fillano:更慢,所以...自己斟酌一下时间间隔。 01/13 11:52
3F:推 mlwmlw:节拍? 01/13 13:44
4F:推 billyllib:感谢大神! 01/13 17:38