我一直在尝试在我的网站上缩放我的徽标，以便填充背景。这个想法是整个浏览器视口应该“潜入”徽标的中心。为此，我制作了徽标的 SVG 文件，并将 jQuery SVG 包含在我的网站中。
我已经开始掌握 jQuery SVG 动画的窍门，但我无法让整个东西从中心缩放。在研究时，我想到了一个想法，即应该在缩放时翻译 SVG，但我还没有完全弄清楚算法或如何将它与 jQuery animate 一起使用。
如果有人可以提供答案，我将不胜感激。
该项目位于此处（以及动画的当前状态）：http ://danieldunderfelt.com
这实际上只是一个 CSS 问题。一开始，您正在使用
position: absolute;
top: 50%;
left: 50%;
margin: -60px 0 0 -50px;
将包含小 svg 的部分居中。这是古老的经典负边距技巧。
问题是，当您放大 svg 时，您还需要将负边距增加到您尚未完成的新（更大）高度和宽度的一半。要么，要么将top值设置为零，这样它就不会向下推。这不是特定于 svg 的问题。您需要为元素的比例和将其定位在页面上的 css 值设置动画。现在你只做第一个。
我建议使用 margin: auto 来使您的部分水平居中。为自己节省一些工作。然后设置 thetop和 the ，top-margin以便在动画结束时将它们放在您想要的位置。
PS 我不确定你是否需要 jquery-svg 来解决这个问题。只需在标记中编写 svg 内联，然后使用 jqueryanimate()进行动画 css 更改。