Animation Shortcodes

The latest discoveries

Intro

I’ve simplified my animate.html file to include variables that allow me to call different animations, rather than needing a new .html file for every single animation. It supports Markdown styling too. I just call the different @keyframe animations I’ve set up in my CSS file using the shortcode. I think it’s marvellous

Example

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
{ {< animate animation-name length timing delay >} }
{ {< /animate >} }

e.g.

{ {< animate fade-in 2s ease-in 1.5s >} }
## Fade Me In!
{ {< /animate >} }

example:

Fade Me In!

Licensed under CC BY-NC-SA 4.0
© Based on the marvellous Stack template by Jimmycai
Parallax stars effect by Sarazond, grid background by Temani Afif