P233
5.03D
V2EX  ›  jQuery

如何用 jQuery 触发 SVG animation 呢?

  •  
  •   P233 · Oct 3, 2013 · 4127 views
    This topic created in 4632 days ago, the information mentioned may be changed or developed.
    比如一个 circle,鼠标 hover 时放大,离开时缩小,思路是 append "<animate attributeName="r" from="22" to="56" dur="0.5s" fill="freeze" />" ,但实际效果是:hover 瞬间放大,离开瞬间缩小,没有任何动画效果。

    用 CSS scale 附带了 blur 效果,客户不满意,所以只好尝试 SVG animate :(
    1 replies    1970-01-01 08:00:00 +08:00
    P233
        1
    P233  
    OP
       Oct 4, 2013
    搞定了,先给 circle
    <animate class="mouse_enter" begin="indefinite" attributeName="r" from="22" to="56" dur="0.2s" fill="freeze" />

    然后 $(".mouse_enter")[0].beginElement();
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   3680 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 34ms · UTC 10:37 · PVG 18:37 · LAX 03:37 · JFK 06:37
    ♥ Do have faith in what you're doing.