使用 .animate() 的 jQuery 在 IE8 中无法执行任何操作

Posted 2023-05-08

【中文标题】使用 .animate() 的 jQuery 在 IE8 中无法执行任何操作

【英文标题】：jQuery using .animate() fails to do ANYTHING in IE8

【发布时间】：2011-02-01 09:54:21

【问题描述】：

所以，这是官方的：我讨厌 Internet Explorer。是的，它的所有血腥版本。 :-D

所以，我不认为我在这里做任何复杂的事情，但显然我是。我在导航菜单样式的无序列表中有一堆列表项，在 Firefox、Chrome、Safari 和 Opera 中，一切正常。应该发生的是，当您悬停导航项时，它应该为一些增长设置动画并为背景颜色更改设置动画。

在 Internet Explorer 7/8 中没有任何反应。

我认为它只是与 animate 函数相关联，因为如果我将 .animate 与 .css 交换，它就可以工作。

http://project-cypher.net/wtf/（*url 已删除 - 问题已解决）

想法？

【问题讨论】：

编码似乎是这样的：pastebin.com/zjmrS9wJ

So, it's official: I hate Internet Explorer. Yes, all bloody versions of it.。什么花了你这么长时间？

@ Lucas Jones：是的，这就是挂钩悬停事件并为锚元素设置动画的 javascript。是我遗漏了什么，还是您对我写的内容进行了更正？

@精英绅士：不开玩笑... :-D

那么它在IE8中有什么作用呢？什么都没有？错误控制台中没有警告或任何内容？在plugins.jquery.com/project/color 上有一些与 IE 相关的待处理错误报告。如果其中一项适用于您，请检查错误控制台。

【参考方案1】：

使用backgroundColor、paddingTop 和paddingBottom 稍微更改您的动画属性，这应该可以：

$('ul.navigation li a').css('padding','0px 12px');
$('ul.navigation li a').hover(function() 
  $(this).stop().animate(
      backgroundColor : '#336699',
      'padding-top': 6,
      'padding-bottom': 6
    , 150 );
, function() 
  $(this).stop().animate(
      backgroundColor: '#660000',
      paddingTop: 0,
      paddingBottom: 0
    , 150 );
);

这个 CSS：

ul.navigation li a 
    padding: 6px 12px;
    color: #fff;
    text-decoration: none;
    background: #600;

【讨论】：

谢谢，这让我更接近了。背景颜色现在淡入淡出。填充仍然没有应用......我已经尝试过你写的内容，也尝试过将值封装在单引号中......到目前为止没有。

@Nick - 是的，在 IE7/8 中没有骰子，在其他浏览器中很好。我正在使用 jQuery 1.4.2。不记得覆盖 .animate() 的颜色插件的版本，但我确实在几天前下载了它。也许我会尝试获取一个新的、未缩小的副本...

这是我正在使用的彩色动画插件的版本：plugins.jquery.com/files/jquery.color.js.txt 仍然不行。我想知道你有什么工作和我有什么不工作有什么不同......

@Cypher - 我错了，在这台装有 IE8 的计算机上不起作用....用可以做的事情更新了答案，页面加载时缺少分配的填充似乎使它无法动画，分配然后删除允许它。看看这里的演示：jsfiddle.net/py57F

是的，这确实成功了！我很高兴 IE 支持条件 cmets...感谢 Nick 的帮助！

【参考方案2】：

前几天我自己也遇到了这个问题。我不明白为什么 IE 没有正确地为对象设置动画。

答案很简单：使用jQuery UI

jQuery UI 包含一个改进的颜色插件，它确实可以工作。

查看 jQuery UI 中的其他简洁功能 - 按钮、对话框、进度条、选项卡等。

【讨论】：

不错的插件。真的与它无关，但无论如何谢谢。

确实如此。 jQuery UI 有一个颜色插件，允许在 animate 中使用 backgroundColor。

【参考方案3】：

如果我将 'padding' : '6px 12px' 更改为 'padding' : '12px' 它似乎可以工作。你可以试试这个并报告它是否对你不起作用？

它并不完美，但它可以做一些事情，让你更接近修复它。

编辑：该死，想知道为什么不。在这里工作。 IE8。 IDK，也许你已经从另一个答案中得到了解决方案。

【讨论】：

Hrm，这在 IE8 中似乎不起作用。没有在 7 中测试... :)