使用 SVG 和 JS 进行转换

Question

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

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

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

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

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

Answer 1

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