【问题标题】:Raphael animate arc with <li>拉斐尔用 <li> 动画弧线
【发布时间】:2016-04-11 01:19:01
【问题描述】:

我正在关注本教程 (http://tympanus.net/codrops/2011/04/22/animated-skills-diagram/),我想添加一个图例列表,可以在图表中模拟相同的动画,但是当您将鼠标放在列表上时。例如,如果您在图例列表中的“HTML”元素中移动鼠标,则图表中的“HTML”弧与您直接在弧中移动鼠标的方式相同

我不知道你是否明白我要解释的内容,我尽力抱歉

但提前感谢您的帮助

【问题讨论】:

  • 有道理,如果你能把一个 jsfiddle 或你的工作放到现在,我相信我们可以提供帮助。
  • Ian --> 我尝试使用 JSFIDLE 但没有成功,所以这是我的网站链接:nathancheval.fr/dev 非常感谢您的帮助。当您将鼠标悬停在 HTML 图例上的那一刻,所有的弧线都显示出来了..
  • 如果不能正确测试就很难说。本能地查看您的代码,看起来很奇怪的是您对 z 变量和范围的使用,但它非常不清楚它应该如何工作。
  • 我终于制作了一个 JSFIDLE 作品。如果你想看的话,这里是链接:jsfiddle.net/Q8KVC/1025 而对于图例项目,我只是尝试了一些东西,所以如果它是凌乱的正常..

标签: javascript jquery raphael diagram


【解决方案1】:

你有两个主要问题......

第一个是 $(".html").mouseover 在“每个”函数内,因此您设置了 5 个左右的鼠标悬停,将在一次悬停时执行。我假设你实际上并不想要这个。

那么 z 变量将超出范围。您需要弄清楚如何设置一个 html 元素来引用相应的 svg 元素。你可以通过给他们一个特定的 id,或者一个哈希表或数组或其他东西来做到这一点。

【讨论】:

  • 我看到每条弧线都有和 id。但我真的不知道如何用他的 id 访问一个弧...
猜你喜欢
  • 2016-03-03
  • 1970-01-01
  • 1970-01-01
  • 2011-10-20
  • 1970-01-01
  • 2015-12-04
  • 2015-09-08
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多