Raphael JS中的动画字体大小是否有流畅的过渡可能性？
到目前为止它似乎不流利 ，但波涛汹涌。 例如，如果您有一个font-size：14的状态属性，并希望使用font-size：16设置动画状态，则转换看起来并不平滑。
它分两步跳。 首先更改为15然后更改为16px。
可以强迫它看起来更顺畅吗？
我正在使用Firefox 14进行测试。
我目前的代码：
var fillerText = { "fill" : "#00738f", "font-size": 14, "font-family": "Arial, Helvetica, sans-serif" } var fillerTextHover = { "fill" : "#00738f", "font-size": 16, "font-family": "Arial, Helvetica, sans-serif", "cursor": "pointer" } text.hover(function () { text.animate(fillerTextHover, 500); }, function () { text.animate(fillerText, 500); } ); 这是一个已知问题，与Raphael无关，但与子像素渲染无关：
在不支持GPU供电的子像素定位的浏览器中查看时，文本似乎跳跃，因为需要使用CPU创建文本，并且每个字母的位置四舍五入到最接近的整个像素。
即使有可能使用新的CSS 3动画，你可以看到它只是在动画完成之前升级字体，然后重新绘制。
对不起，我没有为您提供解决方案，但到目前为止我还没有看到过使用CSS的流畅的跨浏览器字体大小的动画。
但你能做些什么来掩饰这种效果，是为了减少动画间隔时间并扩大字体大小的差距。 然后，这些步骤出现在更快的时间范围内，并且无法看到单个步骤。
看到这个小提琴
我知道没有使用font-size来修改文本元素的解决方案，但我可能不会采用这种方法。 相反，我只需使用与相关文本对应的cufónized路径并手动缩放。 请注意 ，这比手动缩放文本元素明显更平滑，至少在Firefox中是这样。
-
访问Cufón并将我喜欢的字体转换为等效的矢量，选择Raphael.registerFont作为自定义选项;
-
使用
paper.print而不是paper.text生成我的文本。 这将返回路径元素而不是文本元素。 -
使用变换而不是font-size缩放生成的路径元素。 由于
paper.print接受font-size作为参数，因此很容易计算出与目标字体大小相对应的所需比例。
这是一个粗略的演示，展示了它是如何工作的（我将文本放在支持上以便于hover）。 我希望你能赦免它的众多不足之处; 它产生了一点急速。
我认为扩大路径将更容易和更顺畅，如：
text.hover(function() { text.animate({transform: "s1.5 1.5 "}, 400); }, function() { text.animate({transform: "s1.0 1.0 "}, 400); });
有关详细信息，请参见http://jsfiddle.net/SeeG2/40/ 。
查看http://www.zachstronaut.com/posts/2009/08/07/jquery-animate-css-rotate-scale.html
您将能够看到演示并下载扩展元素的插件。 需要注意的是，您无法明确选择目标字体大小，但是，通过一些数学运算，您可以编写一个小插件来将目标大小转换为可缩放的数字。
如果您想查看另一个演示，我的个人主页会在欢迎页面上使用此插件。
祝好运！ 🙂