如何在特定像素处停止图像?

时间:2014-08-02 11:32:58

标签: javascript html css

如何在特定像素处停止移动图像? 有点新的javascript

尝试使用if-else,不确定我是否正确输入了代码。

var imgObj = null;
var animate ;
function init(){
   imgObj = document.getElementById('xTank');
   imgObj.style.position= 'relative'; 
   imgObj.style.left = '0px'; 
}

function moveRight()
{
    if(imgObj<400){
        imgObj.style.left = parseInt(imgObj.style.left) + 10 + 'px';
        animate = setTimeout(moveRight,70); // call moveRight in 20msec
       }
    else
       {
        stopanimate = setTimeout(moveRight,70);
       }
}

window.onload =init;

1 个答案:

答案 0 :(得分:0)

您需要检查左侧样式值,而不是图像对象本身:

function moveRight()
{
    if(parseInt(imgObj.style.left, 10) < 400){
        imgObj.style.left = parseInt(imgObj.style.left, 10) + 10 + 'px';
        setTimeout(moveRight,70); // call moveRight in 20msec
       }
    else
       {
        //stopanimate = setTimeout(moveRight,70); // no need to animate it anymore
       }
}

另外,不要忘记在某个时候调用你的moveRight函数。

见这里:http://jsfiddle.net/shomz/gj3Sa/