jquery - How to use an inline animation of a svg with a javascript on click? -
i working svg on web project. making buildings out of polygons (45 polygons exact) idea change points of polygons when click on button. make animation in between, making building switch different building.
i managed make animation inline on svg animate when open page (with delay now). trying when click button inline animation fire.
this 1 line of code 1 polygon.
<polygon class="b1" fill="#dcdddb" points="555,114 552.5,416 568.5,413.004 "> <animate begin="8000ms" attributename="points" dur="5000ms" to="473.999,335.287 470.845,482.398 461.808,325.766" fill="freeze"/> </polygon>
i hope can me. tried doing css3 -webkit-clip-path takes long time create polygons. it's not entirely necessary have svg inline need responsive.
when button clicked, animation element want (easier if you've given id can use document.getelementbyid) , call element.beginelement()
Comments
Post a Comment