Javascript 我想用简单的html显示一幅从右上角移动到左下角的图像

Javascript 我想用简单的html显示一幅从右上角移动到左下角的图像,javascript,html,Javascript,Html,onmouseover我调用这个函数 function move_arrow() { document.getElementById('arrow1').style.display = "block"; j = 100; for (var i = 1000; i > 260; i--) { document.getElementById('arrow1').style.left = i + 'px';

onmouseover我调用这个函数

function move_arrow() {

        document.getElementById('arrow1').style.display = "block";
        j = 100;
        for (var i = 1000; i > 260; i--) {
            document.getElementById('arrow1').style.left = i + 'px';
            document.getElementById('arrow1').style.top = j + 'px';
            if (j < 440) {
                j = j + .5;
            }
         //alert();      

        }
    }
警报显示图像移动到所需位置,否则不会显示。我知道alert有足够的时间执行函数。
在适用于所有浏览器的简单html和javascript中,什么是正确的解决方案。

您可以使用setInterval,例如:

function move_arrow() {
    document.getElementById('arrow1').style.display = "block";
    j = 100;
    i = 1000;
    var intervalId = setInterval(
        function() {
            i--;
            document.getElementById('arrow1').style.left = i + 'px';
            document.getElementById('arrow1').style.top = j + 'px';
            if (j < 440) {
                j = j + .5;
            }

            if (i < 240)
                clearInterval(intervalId); //switch off setInterval
        }, 
        10 //execute this function every 10ms
    );
}