jquery - .animate 在 IE 中不起作用

Posted 2023-05-08

【中文标题】jquery - .animate 在 IE 中不起作用

【英文标题】：jquery - .animate doesn't work in IE

【发布时间】：2012-10-07 10:57:13

【问题描述】：

我有一些脚本：

$(window).load(function()
$("#kontakt_kontakt").hover(
    function()
       $("#kontakt").animate(left: '',bottom: '+=60', 440); 
    , 
    function()
       $("#kontakt").animate(left: '',bottom: '-=60', 440);  
    );

);

在悬停时，它会使 img 向上移动几个 px。在 chrome 中完美地工作，但在 IE 中并没有真正工作 - 什么也没发生。任何人都知道如何解决它？ 你可以在这里查看：http://kafior.mydevil.net/index.html

【参考方案1】：

你有这个错误：

TypeError: element.dispatchEvent is not a function

element.dispatchEvent(event);

在您的prototype.js 文件中，您包含几个版本的jQuery 和prototype，并且这两个框架都使用$，您需要查看jQuery 中的noConflict 方法，您真的应该尝试删除尽可能多的 jQuery 版本，没有真正的理由需要下载 2-3 个版本的 jQuery。

【参考方案2】：

你有这个错误：

SCRIPT438: Object doesn't support property or method 'dispatchEvent'

这里：

 if (document.createEvent) 
    element.dispatchEvent(event);
  else 
    element.fireEvent(event.eventType, event);
 

从外观上看，您在同一页面上使用 jQuery AND Prototype。您需要运行 jquery noConflict 模式。

jQuery.noConflict();

将此行添加到 jQuery 代码的顶部。

【参考方案3】：

如果您按 F12 然后选择 Console 选项卡，则页面上出现 javascript 错误。

出现错误是因为该页面包含两个不同的 JavaScript 框架 - prototype 和 jQuery，它们都定义了 $ 函数。请参阅 Using JQuery and Prototype in the same page 了解如何使用 jQuery .noConflict() 函数同时运行它们。

另外，你应该考虑优化 jQuery 和 <script> 标签，有很多重复的代码可以组合在一个事件句柄函数中。

【参考方案4】：

它也可以在 IE 中使用，但您的图像会妨碍您。

如果您指向菜单上方的页面，图像会移动。如果您指向图像，它们将不会移动，因为具有悬停事件的元素位于图像后面，并且悬停事件显然不会在 IE 中的图像中冒泡。