javascript - 使用Raphael在鼠标悬停时缩放圆圈

你能帮我这个忙吗？

我正在使用Raphael绘制一个圆，鼠标悬停时该圆应放大和缩小（缩放）。

我能够轻松地增加圆的大小，但是我希望在增加圆的大小之间有一定的效果。它应该像弹性地增加。

我想使用Raphel开发该动画。
你能帮我么

这是我写的代码：

smallCircles[0].hover(function () {
    smallCircles[0].animate({ fill: 'rgb(231,88,88)', opacity: 0.95, r: 55,r:45,r:55, 'stroke-width': 0 }, 100);
  },
  function () {
    smallCircles[0].animate({ fill: 'rgb(240,153,153)', opacity: 0.8, r: 35, 'stroke-width': 0 }, 300);
});

谢谢，
纳加朱纳

最佳答案

您是否尝试过使用内置的缓动修饰符？

我还没有测试以下内容，但是也许可以。我为easing方法添加了'弹性'作为animate参数

smallCircles[0].hover(function () {
    smallCircles[0].animate({ fill: 'rgb(231,88,88)', opacity: 0.95, r: 55,r:45,r:55, 'stroke-width': 0 }, 100, 'elastic');
  },
  function () {
     smallCircles[0].animate({ fill: 'rgb(240,153,153)', opacity: 0.8, r: 35, 'stroke-width': 0 }, 300, 'elastic');
});