Doesn't work
ibmua opened this issue · 2 comments
ibmua commented
Browser:
Linux [Chrome, Firefox], iOS [Safari], most likely, all others too.
Link to your SVG:
<svg width="210mm" height="297mm" version="1.1" viewBox="0 0 210 297" xmlns="http://www.w3.org/2000/svg" class="">
<g fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="4">
<path d="m113.86 38.818c-11.211-17.466-34.468-25.994-56.127-20.58-18.772 4.693-32.493 25.299-35.814 43.565-22.352 122.94 187.7 86.458 91.941-22.985z" class="ODtDaQlq_0"></path>
<path d="m93.544 51.112c-73.066-82.395-40.496 145.4 10.691 43.03" class="ODtDaQlq_1"></path>
</g>
<style>.ODtDaQlq_0{stroke-dasharray:380 382;stroke-dashoffset:381;}.start .ODtDaQlq_0{animation:ODtDaQlq_draw 2033ms linear 0ms forwards;}.ODtDaQlq_1{stroke-dasharray:180 182;stroke-dashoffset:181;}.start .ODtDaQlq_1{animation:ODtDaQlq_draw 966ms linear 2033ms forwards;}@keyframes ODtDaQlq_draw{100%{stroke-dashoffset:0;}}@keyframes ODtDaQlq_fade{0%{stroke-opacity:1;}94.44444444444444%{stroke-opacity:1;}100%{stroke-opacity:0;}}</style></svg>
Steps to reproduce it:
Setting pure svg code inside
maxwellito commented
Hiya,
Sorry about the delay I was AFK for a while.
Your SVG is working, but you asked to trigger the animation manually. You only need to add the class start
to your SVG to start. Here is an example.
ibmua commented
Oh, wow! True. Guess, I didn't notice I've seet it to manual. Thanks a lot!