[英]How to modify the width of SVGs with JQuery
I'm using Articulate Storyline and I want to modify the width of a line that I've created in the software using Javascript .我正在使用 Articulate Storyline,我想修改我在软件中使用Javascript创建的线条的宽度。
I already know that I can select any items (every item export to SVGs in Storyline's output) using This line of code:我已经知道我可以使用这行代码select任何项目(每个项目都导出到 Storyline 输出中的 SVG):
var item = $('[aria-label="Ourline"] svg')
Then we should be able to do some jQuery animations...然后我们应该可以做一些 jQuery 动画...
The problem is I can't modify the width attribute of the selected line using code below:问题是我无法使用以下代码修改所选行的宽度属性:
$(item).attr("width","500");
It just changes the position of the line 500 px to the right?它只是将 500 px 行的 position 向右更改? What?!
什么?!
Any suggestions would be appreciated.任何建议,将不胜感激。
Please note: The question has nothing to do with Storyline, It's all about SVGs and jquery.请注意:这个问题与 Storyline 无关,都是关于 SVG 和 jquery。
https://jsfiddle.net/whLf02n8/ https://jsfiddle.net/whLf02n8/
html: html:
<svg height="100" width="100">
<circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />
</svg>
<button id="7">7</button>
<button id="3">3</button>
javascript: javascript:
$('button').click(function() {
const id = $(this).attr('id');
$('svg circle').attr('stroke-width', id);
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.