javascript问题,请大家帮忙,如何利用settimeout和setinterval来让图片从左往右慢慢移动过来

2025-01-01 18:32:50
推荐回答(2个)
回答1:

function getStyle(obj, attr){
if(obj.currentStyle){
return obj.currentStyle[attr];
}else{
return getComputedStyle(obj, false)[attr];
}
}//获取计算后的样式 if else为了兼容浏览器

function Animate(obj, json){ //json为一个{left: width} 的对象 left 左右移动 width 图片宽度(正数左向右 负数右向走)
if(obj.timer){
clearInterval(obj.timer); //为了渐进效果 清楚前边的timer
}
obj.timer = setInterval(function(){
for(var attr in {left:width}){
var iCur = parseInt(getStyle(obj, attr)); //获取当前位置
iCur = iCur ? iCur : 0;
var iSpeed = (json[attr] - iCur) / 5; //获取速度 5越大速度越慢
iSpeed = iSpeed > 0 ? Math.ceil(iSpeed) : Math.floor(iSpeed); //取整
obj.style[attr] = iCur + iSpeed + 'px'; //移动计算后像素的位置
if(iCur == json[attr]){ //当当前位置等于想移动的位置时 清除循环
clearInterval(obj.timer);
}
}
}, 30);
}
这个可能有点难懂 但复用性和效果很好 注释我都写好了 也是最近研究的 正好写给你- -

回答2:

HTML



JS
window.onload=function(){
var d = document.getElementById('d');
setinterval(function(){
d.style.left += 2+"px";

},30);

}