SVG-SMIL-Snippets
A set of custom SVG-SMIL snippets for Sublime Text 2/3
Labels snippets
Details
Installs
- Total 1K
- Win 663
- Mac 357
- Linux 124
Oct 10 | Oct 9 | Oct 8 | Oct 7 | Oct 6 | Oct 5 | Oct 4 | Oct 3 | Oct 2 | Oct 1 | Sep 30 | Sep 29 | Sep 28 | Sep 27 | Sep 26 | Sep 25 | Sep 24 | Sep 23 | Sep 22 | Sep 21 | Sep 20 | Sep 19 | Sep 18 | Sep 17 | Sep 16 | Sep 15 | Sep 14 | Sep 13 | Sep 12 | Sep 11 | Sep 10 | Sep 9 | Sep 8 | Sep 7 | Sep 6 | Sep 5 | Sep 4 | Sep 3 | Sep 2 | Sep 1 | Aug 31 | Aug 30 | Aug 29 | Aug 28 | Aug 27 | |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Windows | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 |
Mac | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 |
Linux | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 |
Readme
- Source
- raw.githubusercontent.com
SVG-SMIL-Snippets
Type the snippet shortcode and then press Tab
to complete the snippet.
The snippets are listed below in alphabetical order. The '$1'
indicates the position of the caret/s. Some snippets have been set up so that pressing Tab jumps the caret/s to the next predefined spot. It's a little hard to explain, but any snippet that has a $1/$2/$3/etc. uses this technique.
Package Control
DEMO VIMEO
animapath
<animate attributeName="d" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animafill
<animate attributeName="fill" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animahe
<animate attributeName="height" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animalinex1
<animate attributeName="x1" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animalinex2
<animate attributeName="x2" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animaliney1
<animate attributeName="y1" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animaliney2
<animate attributeName="y2" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animamotionmpath
<animateMotion dur="$1" repeatCount="$2" rotate="$3">
<mpath xlink:href="$4"/>
</animateMotion>
animamotionpath
<animateMotion path="$1" begin="$2" dur="$3" calcMode="$4" keyPoints="$5" rotate="$6" fill="$7"/>
animamotionvalues
<animateMotion values="$1" begin="$2" dur="$3" calcMode="$4" keyPoints="$5" rotate="$6" fill="$7"/>
animaopa
<animate attributeName="fill-opacity" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>```
###animapoints
```html
<animate attributeName="points" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animaradius
<animate attributeName="r" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animarx
<animate attributeName="rx" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animastroke
<animate attributeName="stroke" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animastrokedash
<animate attributeName="stroke-dasharray" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animastrokeoff
<animate attributeName="stroke-dashoffset" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animastrokelinejoin
<animate attributeName="stroke-line-join" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animastrokeopa
<animate attributeName="stroke-opacity" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animastrokewi
<animate attributeName="stroke-width" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>```
###animarotate
```html
<animateTransform attributeName="transform" type="rotate" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animascale
<animateTransform attributeName="transform" type="scale" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animaskewx
<animateTransform attributeName="transform" type="skewX" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animaskewy
<animateTransform attributeName="transform" type="skewY" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animatranslate
<animateTransform attributeName="transform" type="translate" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animaview
<animate attributeName="viewbox" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animawi
<animate attributeName="width" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animax
<animate attributeName="x" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>
animay
<animate attributeName="y" values="$1" begin="$2" dur="$3" calcMode="$4" keyTimes="$5" fill="$6"/>