Code challenge - introduction to CSS animations and tranform property
- Introduction to intermediate css concepts
- Chrome, Sublime, Terminal
- CSS Animation
- CSS Transform
- Fork and Clone this repo
- Create animation.css file inside your css folder
- Link your animate.css
- Apply a transform property to rotate the div with an id of 'rotate'
- Apply a transform property to skew the div with an id of 'skew'
- Apply multiple properties to the div with an id of 'all'
- Create and name a keyframe.
- Add css properties to 2-3 stages of animation
- Add the keyframe to the div with an id of 'animate'
- Create new HTML 5 elements for each new example
- Create new CSS for each new element
- Create a js folder and app.js file and link it to the project index.html
- Use a CSS pseudo class to trigger animation or transform
- Add a Javascript event to trigger animation or transform
- Create a new git branch
- Enhance the first divs: rotate and skew
- Add Js events to the first divs: rotate, skew, all and animate
- CSS Tricks - Keyframe Animation
- W3 Schools - CSS Animations