JavaScript Div Annimation

JavaScript Div Annimation

本文关键字：Annimation Div JavaScript      更新时间：2023-09-26

我想知道是否有任何特定的方法可以让javaScript代码在某些时候停止执行，以便允许另一个被调用的函数执行，例如，在使用div的排序算法中，您调用一个动画交换两个div的函数，以便您可以直观地看到排序发生。我试过使用setTimeout(c,t);然而，如果我放置一个警报(")，它似乎没有等待，div似乎也没有移动;在移动代码中，它似乎允许移动发生，并弹出数千个警报。

我的代码如下:

var q;
var w;
function move(x,y)
{
    q = x.style.top; // Keep a reference to the Top divs top element
    w = y.style.top; // Keep a reference to the Top divs top element
    doMove(x,y);
}
function doMove(topDiv, bottomDiv)
{
    //alert("in doMove " + topDiv);
    topDiv.style.top = parseInt(topDiv.style.top)+2+'px';
    bottomDiv.style.top = parseInt(bottomDiv.style.top)-2+'px';
    //alert("hi");
    if(bottomDiv.style.top != q && topDiv.style.top != w) // Check if the Top and Bottom divs have finally swapped
    {
        setTimeout(doMove(topDiv,bottomDiv),20); // call doMove in 20msec
    }
}

代码中的一个问题是:

setTimeout(doMove(topDiv,bottomDiv),20);

您正在立即调用doMove，并将值undefined作为第一个参数传递给setTimeout。我不完全确定下面的方法能解决你的问题，但我建议你试一下:

setTimeout(function() { doMove(topDiv,bottomDiv); }, 20);
相关文章：