Question

我对这个IE 7感到疯狂......

==＆GT; hhttp：//neu.emergent-innovation.com/

为什么以下功能在IE 7中不起作用，但与Firefox完全兼容？ animate-function中是否有错误？

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表现正常......我认为这是“溢出：隐藏”的事情 - 但这并没有改变任何东西。

我已经尝试过手风琴插件，但它的行为完全一样......

Answer 1

我遇到了类似animate函数的问题，当它显示来自核心jQuery库的错误时感到很惊讶。但是jQuery很好，你需要提供它的IE。

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

例如，将div连续向左移动，

JQuery的：

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

CSS：

#mydiv { position: absolute;    top: 0;    left: 0; }

如果你没有放入左边和右边。最佳起始位置IE最终会抛出错误。

希望这有帮助

Answer 2

如保罗所说，使用该方法时。 Animate（）jQuery IE7浏览器无法在内部识别属性“position”。例如

CSS规则：

li p (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 (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()

在我的情况下，它以这种方式解决了。

Answer 3

经过一天的想知道为什么IE不会动画的东西我发现某些版本的JQuery不再做他们曾经做过的事情：

此：

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

不适用于此Jquery： https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js

但它适用于： https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js

万岁旧版本！

Answer 4

我不确定问题到底是什么......也许你不能动画为“display: none”？试试这个：

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

...想一想，如果容器上没有设置overflow: hidden，可能会出现其他一些问题。

最好的方法可能是避免重新发明轮子：jQuery UI插件有一个内置的手风琴。 http://docs.jquery.com/UI/Accordion我相信尊敬的Resig先生＆amp;公司已经处理过你可能遇到的任何错误。

Answer 5

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

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

Answer 6

我最近遇到了一个问题，其中animate（）没有按预期工作，而是由IE渲染我的css填充：属性与FireFox不同。

这似乎发生在其他人身上，我不得不在我的CSS中乱砍;使用边距和固定宽度以及其他如此可怕的IE黑客，而不是。

Answer 7

更改IE的持续时间。使它成为你在FF中的1/10，它应该接近两个浏览器中的相同行为：

FF

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

IE

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

应该修理它。

Answer 8

这可能是偏离主题，但我正在玩JQuery，它很棒但是Javascript的新手我没有意识到IE 7和IE 8无法识别const关键字。这是什么阻止我的JQuery运行不是动画的问题..希望可能有助于一些绝望的灵魂。男人，我等不及要回到好的AS3和Flex ..

见 http://www.gtalbot.org/BrowserBugsSection/MSIE7Bugs/JSConstKeyword.html

了解更多

JQuery：animate（）在IE中没有按预期工作

8 个答案: