为什么我的 Raphael.js 圆形对象没有得到它的“attr”？改变动画&没有将 jQuery HandlerOut 事件对象应用于它？

Question

我创建了一个 #logo DIV，它由一个较小的 #circle DIV 和一个较小的 #circle DIV 组成。 h1。 #circle 充当我的 Raphael.js 对象（一个圆圈）在其中渲染的 DIV/画布。我的目标是当用户将鼠标悬停在 #logo DIV Raphael.js 圆和 h1 将变得动画，但我遇到了一些问题。

• 由于某种原因，我的 Raphael.js 圆对象在 jQuery .hover() handlerIn 期间没有获得其 .attr() 方法动画> 鼠标事件。变化立即发生。

• 此外，在 handlerOut 事件期间，Raphael.js 循环根本不会应用其 .attr() 方法。它只保留在 handerIn 事件期间应用于它的 .attr() 属性

我的此问题示例位于此处。您可以单击该页面的预览（右上角）来查看正在运行的代码。

Answer 1

$(c.node).animate({fill: "#666"}, 2000);

这是 jQuery 动画。显然 jQuery 对 Raphaël 对象一无所知。使用 Raphaël 动画代替：

c.animate({fill: "#666"}, 2000);

一般建议不要触摸节点属性，除非您真的知道自己在做什么。