Javascript jQuery animate方法无法在Chrome和IE中同时设置两个div页边距的动画（适用于FF）

我试图使用jqueryanimate方法来调整两个并排div的边距，以使div在可见性中左右滑动

在Firefox中，这可以顺利工作。在IE和Chrome中，似乎有一个div的边距正在制作动画，但另一个在第一个div的动画完成之前无法制作

下面是一个JSFIDLE：

以下是jQuery代码：

$( "div#PrevButton" ).click(function() {
    $( "div#ACHPanel" ).animate({
        marginLeft: '-=730px'
    }, { duration: 1000, queue: false });
    $( "div#SummaryPanel" ).animate({
        marginLeft: '+=730px'
    }, { duration: 1000, queue: false });
});

$( "div#NextButton" ).click(function() {
    $( "div#ACHPanel" ).animate({
        marginLeft: '+=730px'
    }, { duration: 1000, queue: false });
    $( "div#SummaryPanel" ).animate({
        marginLeft: '-=730px'
    }, { duration: 1000, queue: false });
});    

---

我主要只是更改了css元素的位置，并添加了一些包装

我将右边的条放入包装器中，包装器绝对位于容器的右边。我还将电子邮件栏放在底部的包装中，包装也是绝对定位的

CSS：

div#ACHPanel {
    float: left;
    height: 360px;
    width: 230px;
    padding: 0px 10px 10px 10px;
}

div#ACHPanelWrapper {
    width: 256px;
    padding: 0; 
    background-color: #A6B0D2;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 0;
}

div#emailWrapper {
    margin: 0 10px 0 0;
    position: absolute;
    top: 410px;
    right: 0;
}

您的jQuery没有太大变化。我刚刚删除了对ACH框的引用

$( "div#PrevButton" ).click(function() {
    $( "div#SummaryPanel" ).animate({
        marginLeft: '+=730px'
    }, { duration: 1000, queue: false });
});

$( "div#NextButton" ).click(function() {
    $( "div#SummaryPanel" ).animate({
        marginLeft: '-=730px'
    }, { duration: 1000, queue: false });
});

---

您可能需要稍微调整css以获得您想要的间距，但这适用于chrome、firefox和IE。

谢谢，这正是我所需要的！