Scroll into view
Animations
Copy this section into your styleguide.
1. Select an element you want to animate
2. Press CMD + 'Enter' to quickly navigate to style selector . (Ctrl + 'Enter' on Windows PCs)
3. Type '8' as a shortcut to see a list of the below animations.(matches the class name 'anim8_')
4. Pick your desired effect and check out your new animation in preview 🎉
5. Rinse & Repeat for any desired elements
2. Press CMD + 'Enter' to quickly navigate to style selector . (Ctrl + 'Enter' on Windows PCs)
3. Type '8' as a shortcut to see a list of the below animations.(matches the class name 'anim8_')
4. Pick your desired effect and check out your new animation in preview 🎉
5. Rinse & Repeat for any desired elements
anim8_slide-up
In this instance, 'su' means 'slide up'. 'd15' = 'delay 150ms'
anim8_su-d15
anim8_su-d15
anim8_su-d15
![Web Design Galway - Legency Media Logo](https://assets-global.website-files.com/64f303cf024c8cd1da32b9bc/64f306ca9c0d653c3c9ef1f2_legencymedia-stacked-boxed.webp)
anim8_su-d30
![Web Design Galway - Legency Media Logo](https://assets-global.website-files.com/64f303cf024c8cd1da32b9bc/64f306ca9c0d653c3c9ef1f2_legencymedia-stacked-boxed.webp)
anim8_su-d45
![Web Design Galway - Legency Media Logo](https://assets-global.website-files.com/64f303cf024c8cd1da32b9bc/64f306ca9c0d653c3c9ef1f2_legencymedia-stacked-boxed.webp)
anim8_slide-from-left
anim8_sfr
![Web Design Galway - Legency Media Logo](https://assets-global.website-files.com/64f303cf024c8cd1da32b9bc/64f306ca9c0d653c3c9ef1f2_legencymedia-stacked-boxed.webp)
anim8_sfr-d15
![Web Design Galway - Legency Media Logo](https://assets-global.website-files.com/64f303cf024c8cd1da32b9bc/64f306ca9c0d653c3c9ef1f2_legencymedia-stacked-boxed.webp)
anim8_sfr-d30
![Web Design Galway - Legency Media Logo](https://assets-global.website-files.com/64f303cf024c8cd1da32b9bc/64f306ca9c0d653c3c9ef1f2_legencymedia-stacked-boxed.webp)
anim8_sfr-d45
![Web Design Galway - Legency Media Logo](https://assets-global.website-files.com/64f303cf024c8cd1da32b9bc/64f306ca9c0d653c3c9ef1f2_legencymedia-stacked-boxed.webp)