我正在尝试找出在我的网站上为图形元素设置动画的最佳方法。
我查看了 html5 画布，但似乎 SVG 是最合适的。
我会解释事情应该如何运作，也许你们可以给出你的意见。
在页面上，我想让我的产品在用户选择箭头时滑入和滑出，一次只有一个产品在中心。当图像滑入和滑出时，我想要某种缓和。SVG 是否有不同的动画风格，如弹性等...？还是我应该只使用 jquery 来制作动画？
接下来，每个产品都会有一个描述，该描述将包含在一个形状中。也许形状会随机绘制，所以我需要一个绘图 api。我也希望这个容器有类似的缓动，因为它会滑入。
我真的很困惑 svg 如何与其他 Web 技术集成。
编辑：
是否可以为 svg 多边形的点设置动画？
<svg id="svgelem2" height="190" xmlns="http://www.w3.org/2000/svg">
<polygon points="0,0 800,0, 800,180 0,180 " fill="white" filter="url(#dropshadow)" />
听起来你想要这样的东西：http ://svg-wow.org/photoAlbum/album.svg将鼠标放在底部的图像上，它们会缓入并展开。
您可以使用 javascript，但在 javascript 之上，您需要在 DOM 中操作一些东西：直接使用 HTML 或 SVG，或者包装在两者之一中的东西。
有几个流行的库要么基于画布（paper.js，processing.js），要么基于 SVG（d3，raphael）。我的理解是，如果您希望您的最终产品可用于尽可能多的平台（所有当前版本的顶级浏览器、顶级浏览器的最后三个版本以及主要的移动设备） - 您需要坚持使用基于画布的库。并非所有浏览器都同样好地支持 SVG，或者根本不支持（当然，维基百科对此有一些很好的信息:)）。
如果你用路径渲染 SVG （你可以用路径做多边形，用路径），动画绝对是可能的......我相信你可以用 SVG 多边形来做，但我找不到一个现成的例子。
就个人而言，我喜欢d3.js，但我知道它不会渲染/动画到画布 - 但是，paper.li 和 processing.js 会渲染到画布或 raphael 到VML ......所以如果接触最广泛的观众是担心，你可能想走那条路。
此浏览器对 SVG 的支持表可能对您做出决定有所帮助/提供信息。
您是否尝试过 Raphael.js 库。它允许您随意操作 SVG。
