<分区>
标签 javascript jquery html css svg
我在 codepen 上找到了这个量规，但我似乎找不到如何调整气泡中的值。我可以在 js 中直接更改这些栏，但不能使用 jq/js。
<path id="Fill-13" fill="#F8B50F" d="M3.7 88.532h26.535v-#.795H3.7z"/>
如果您将主题标签更改为 0 到 12 之间的值，它会调整仪表，但不会调整气泡。
Codepen 链接:https://codepen.io/sondik/pen/pdypaM/
最佳答案
在您的代码笔中，您有以下代码:
HTML
<g id="liquid">
<path id="Fill-13" fill="#956" d="M3.7 88.532h26.535v-2.738H3.7z"/>
<path id="Fill-14" fill="#956" d="M3.7 88.532h13.267v-2.738H3.7z"/>
</g> ^^^^^
我发现如果将 2.738 更改为 1，则可以最好地使用 js 数字
<path id="Fill-14" fill="#956" d="M3.7 88.532h13.267v-1H3.7z"/>
Javascript
tlBubbles.staggerTo(
bubbles,
0.8,
{ y: -20, ease: Power2.easeOut, scale: 0.5, autoAlpha: 0 },
0.4
);
当您更改 y 值时，气泡会改变位置。
tlLiquid
.set(liquid, { transformOrigin: "50% 100%" })
.to(liquid, 4, { scaleY: 10, ease: Elastic.easeInOut.config(1, 0.4) });
在 scaleY 中将 HTML 代码设置为每 10 个 1，您将获得 1 个“液位计”
关于javascript - 使用 jQuery 或 Javascript 更改 svg 速率，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/47534781/