使用JAVASCRIPT移动div，如CSS3，没有滞后

Question

我的javascript代码有问题，我正在用javascript（非CSS3）移动页面中的一个div，它包含一些滞后！我该怎么做才能从这种滞后中解脱出来？（有了CSS3，我不会有任何滞后，但我不会使用JAVASCRIPT）：|THank u提前。

我的Java脚本：

var margin_left_ltr = -1366;
var margin_left_rtl = 1366;
var margin_left_controler = 2.75;
function go_next(){
    var coming = setInterval(function come(){
        var firstDiv = document.getElementById('first_ltr');
        var thirdDiv = document.getElementById('third_ltr');
        var secondDiv = document.getElementById('second_rtl');
        firstDiv.style.marginLeft = margin_left_ltr + margin_left_controler + 'px';
        thirdDiv.style.marginLeft = margin_left_ltr + margin_left_controler + 'px';
        secondDiv.style.marginLeft = margin_left_rtl + (-margin_left_controler) + 'px';
        if((parseInt(window.getComputedStyle(firstDiv).marginLeft)) >= 0){
            clearInterval(coming);  
        }   
        margin_left_controler += 2.80;
    },10)
}

我的HTML:

<div class="click" onClick="go_next();">
        click here!   
</div>
<div id="container_about_us">
    <div id="first_ltr">
        <div id="exit" onClick="go_out();">
            X
        </div>
    </div>
    <div id="second_rtl">
    </div>
    <div id="third_ltr">
    </div>
</div>  

Answer 1

使用jQuery可以轻松完成此操作。要通过增加边距来移动div，请使用：

function go_next(){
    var firstDiv=$('#first_ltr'),
        secondDiv=$('#second_ltr'),
        thirdDiv=$('#third_ltr');
    //Rest of your code.To move with margins :
    firstDiv.animate({"margin-left":"+= 2.75px"},1000);
    secondDiv.animate({"margin-left":"+= 2.75px"},1000);
    thirdDiv.animate({"margin-left":"+= 2.75px"},1000);
}