javascript - 使用 SVG 和 JS 进行过渡

标签 javascript css svg

我有一个我无法解决的问题。

我正在做一个菜单,我想要一个很酷的打开/关闭按钮,所以我制作了一个 SVG 文件并使一切都变得漂亮。

.icon-grid {
  width: 50px;
  height: 50px;
  fill: #000;
  transition: all 1s ease;
}

https://jsfiddle.net/mateuszrybin/0n78dg30/ 按下按钮。

我遇到的问题是无法在黑色和红色之间进行填充过渡。颜色刚刚弹出。它适用于旋转但不适用于填充,有人有什么想法吗?

最佳答案

您应该使用 SVG DOM API。 here 上有一个很好的教程.通读一遍。一切都解释得很好。

关于javascript - 使用 SVG 和 JS 进行过渡,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29354661/

相关文章:

javascript - 按钮在动态表中显示为 [object Object]

python - flask 在运行时不读取 bootstrap.css (mac)

javascript - 无法更改 SVG 元素的类名

javascript - 动画 SVG 阻止 D3 仅在 iOS 中转换单独 div 的 `top` 样式

html - SVG 真的应该覆盖这个对话框吗?

javascript - 如何检测是否为 div 启用了显示更多?

javascript - 文本输入 输入空格

javascript - 使用 javascript(或 jQuery)选择和操作 CSS 伪元素,例如::before 和::after

javascript - 切换嵌套表格列 - html、jQuery

css - IE10 删除了右对齐输入的填充