0phoff / slidev-addon-animattr

SliDev addon to animate an element with a data-attribute
https://0phoff.github.io/slidev-addon-animattr/
MIT License
6 stars 1 forks source link

Add support for SVG SMIL animations #1

Closed 0phoff closed 1 year ago

0phoff commented 1 year ago

In order to increase the usefulness of this plugin, we could add support for SMIL animations. SMIL animations give additional animation possibilities that are not possible with CSS.

This integration could work by specifying the ID of an SVG animation element for a specific click. Eg. v-animattr:smil='[id1, id2]' would start animation id1 on the first click and id2 on the second click.

The SVG API has a beginElement, beginElementAt, endElement and endElementAt, which allows to start and stop these SMIL animations. There is thus a possibility to start/stop animations: v-animattr:smil='[+id1,-id1]'.


Example of the possibilities for SMIL animations: https://css-tricks.com/guide-svg-animations-smil/

0phoff commented 1 year ago

Issue #3 should be resolved before we tackle this one !