JavaScriptタイマー管理スイッチ設定、コールバック関数
1556 ワード
var oBtn1 = document.getElementById('btn1');
var oBtn2 = document.getElementById('btn2');
var oDiv = document.getElementById('div1');
oDiv.timer = null;
oBtn2.onclick = function() {
doMove(oDiv,'left',12,800);
}
oBtn1 .onclick = function() {
doMove(oDiv,'left',-12,10);
}
//
function doMove(obj,attr,dir,target,endFn){
clearInterval(obj.timer);
//alert(getStyle(oDiv,'left'));
obj.timer = setInterval(function() {
var speed = parseInt(getStyle(obj, attr))+dir
if(speed>target&&dir>0 ||speed<target&&dir<0){
speed=target;
}
obj.style[attr] = speed + 'px';
if(speed==target){
clearInterval(obj.timer);
}
if(endFn){
endFn();
}
}, 30)
}
//
function getStyle(obj, attr) {
// //IE6.7.8
return obj.currentStyle ? obj.currentStyle[attr] : getComputedStyle(obj)[attr]
}
// ， ， ， --
doMove(oDiv,'left',12,900,function(){
doMove(oDiv,'top',12,900);
});