JQuery:animate（）不'；在IE中无法按预期工作

我对这个IE 7越来越疯狂了

==>hhttp://neu.emergent-innovation.com/

为什么以下功能在IE7中不起作用，但在Firefox中却很完美？动画功能中是否存在错误

function accordion_starting_page(){
    // hide all elements except the first one
    $('#FCE-Inhalt02-ContentWrapper .FCE-Fade:not(:first)').css("height", "0").hide();
    $('#FCE-Inhalt02-ContentWrapper .FCE-Fade:first').addClass("isVisible");

    $('div.FCE-Title').click(function(){

        // if user clicks on an already opened element => do nothing
        if (parseFloat($(this).next('.FCE-Fade').css("height")) > 0) {
            return false;
        }

        var toHide = $(this).siblings('.FCE-Fade.isVisible');

        toHide.removeClass("isVisible");

        // close all opened siblings
        toHide.animate({"height": "0", "display": "none"}, 1000);

        $(this).next('.FCE-Fade').addClass("isVisible").animate({"height" : "200"}, 1000);

        return false;
    });
}

非常感谢你的帮助

---

非常感谢，这些都是很好的提示！不幸的是，它仍然不起作用

问题是IE显示两个容器的内容，直到动画结束。。。Firefox行为正常。。。我以为是“溢出：隐藏”的问题，但这并没有改变任何事情

---

我已经尝试了手风琴插件，但它的行为完全相同…

我不确定到底是什么问题。。。也许您无法将动画设置为“

display:none

”？试试这个：

toHide.animate({ height : 0 }, 1000, function() { $(this).hide(); });

…我想，容器上没有设置

overflow:hidden

，可能还有其他一些问题

---

最好的方法可能是避免重新发明轮子：jQueryUI插件内置了一个手风琴。我相信尊敬的Resig&Co先生已经解决了您可能遇到的任何错误。

您可以使用jQuery选择器：visible，而不是切换isVisible类

---

另外，您的动画在功能上似乎与slideUp（1000）相同。

最近我遇到了一个问题，animate（）没有按预期工作，这是由于IE呈现了与FireFox不同的css padding:properties

---

这似乎发生在其他人身上，我不得不在我的css中四处转转；相反，使用边距和固定宽度以及其他类似可怕的IE黑客攻击。

我在animate函数中遇到了类似的问题，当它显示来自核心jQuery库的错误时，我感到惊讶。然而jQuery很好，它就是你需要迎合的IE

在IE中为元素的任何属性设置动画时，您需要确保CSS中有一个要更改的属性的起点。这也适用于狩猎

例如，不断向左移动div

JQuery：

var re = /px/;
var currentLeft = $("#mydiv").css('left').replace(re,'') - 0;
$("#mydiv").css('left',(currentLeft-20)+'px');

CSS:

如果你不把一个左上起始位置IE将最终抛出一个错误

---

希望这有助于

在使用该方法时，如Paul所述。Animate（）jQuery IE7浏览器在内部无法识别属性“position”。乙二醇

CSS规则：

li p (bottom:-178px; color: white; background-color: # 4d4d4d; height: 100%; padding: 30px 10px 0 10px;)

li p (position: absolute; left: 0; bottom:-178px; color: white; background-color: # 4d4d4d; height: 100%; padding: 30px 10px 0 10px;)

在jQuery中实现动画：

$('li').hover(function(){

              $this = $(this);

              var bottom = '-45px'; //valor default para subir.

              if( $this.css('height') == '320px' ){bottom = '-115px';}

              $this.css('cursor', 'pointer').find('p').stop().find('.first').hide().end().animate({bottom: bottom}, {queue:false, duration:300});

      }, function(){

         var $this = $(this);

         var bottom = '-178px'; //valor default para descer

            if( $this.css('height') == '320px' ){bottom = '-432px';}

         $this.find('p').stop().animate({***position: 'absolute'***, bottom:bottom}, {queue:false, duration:300}).find('.first').show();

      });//fim do hover()

在所有浏览器中工作的内容：

CSS规则：

li p (bottom:-178px; color: white; background-color: # 4d4d4d; height: 100%; padding: 30px 10px 0 10px;)

li p (position: absolute; left: 0; bottom:-178px; color: white; background-color: # 4d4d4d; height: 100%; padding: 30px 10px 0 10px;)

JQuery代码：

   $('li').hover(function(){

                 $this = $(this);

         var bottom = '-45px'; //valor default para subir.

              if( $this.css('height') == '320px' ){bottom = '-115px';}

              $this.css('cursor', 'pointer').find('p').stop().find('.first').hide().end().animate({bottom: bottom}, {queue:false, duration:300});

      }, function(){

         var $this = $(this);

         var bottom = '-178px'; //valor default para descer

            if( $this.css('height') == '320px' ){bottom = '-432px';}

         $this.find('p').stop().animate({bottom:bottom}, {queue:false, duration:300}).find('.first').show();

      });//fim do hover()

---

在我的例子中，它是这样解决的。

更改IE的持续时间。将其设置为FF中的1/10，并且在两种浏览器中应该接近相同的行为：

FF

即

---

应该会解决它。

这可能是离题了，但我正在玩弄JQuery，它很棒，但作为Javascript新手，我没有意识到IE7和IE8不能识别const关键字。这就是阻止我的JQuery运行的原因——动画不是问题……希望这能帮助一些绝望的灵魂。伙计，我迫不及待地想回到好的ol AS3和Flex

看

---

想了解更多信息，在一天的思考之后，我发现有些版本的JQuery不再像以前那样做了：

这：

无法使用此Jquery：

但它确实适用于：

---

万岁老版本

那么你得到了什么，你期望得到什么呢？我期望它的行为和Firefox一样：容器的内容在动画中被覆盖和显示。IE7立即显示“新”内容，并显示“旧”内容，直到动画完成……我注意到了同样的事情。尝试升级到，但出现了相同的问题。

$("#map").animate({"top": (pageY - 101) + "px"},{"easing" : "linear", "duration" : 20});

$('#bs1').animate({
    "left": bs1x
}, 300, function() {
    // Animation complete.
});