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