I'm using Articulate Storyline and I want to modify the width of a line that I've created in the software using Javascript .
I already know that I can select any items (every item export to SVGs in Storyline's output) using This line of code:
var item = $('[aria-label="Ourline"] svg')
Then we should be able to do some jQuery animations...
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? What?!
Any suggestions would be appreciated.
Please note: The question has nothing to do with Storyline, It's all about SVGs and jquery.
https://jsfiddle.net/whLf02n8/
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:
$('button').click(function() {
const id = $(this).attr('id');
$('svg circle').attr('stroke-width', id);
})
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.