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
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 | Aug 26 | Aug 25 | Aug 24 | Aug 23 | Aug 22 | Aug 21 | Aug 20 | Aug 19 | Aug 18 | Aug 17 | Aug 16 | Aug 15 | Aug 14 | Aug 13 | Aug 12 | Aug 11 | Aug 10 | Aug 9 | Aug 8 | Aug 7 | Aug 6 | Aug 5 | Aug 4 | Aug 3 | Aug 2 | Aug 1 | Jul 31 | |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
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"/>