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