smallfurrr / css_animation_news

---

Title: Flying Newspaper
Type: Morning Exercise
Duration: "0:45"
Creator: Matt Huntington
Adapted by: Karolin Rafalski
Course: WDIr Hopper
Competencies: CSS Animations
Prerequisites: CSS, HTML

---

Make a newspaper (a <div> element) fly!

Original Inspiration
Karolin's Version

Choices

Start from scratch or start with starter_code. If you are using the starter code feel free to change the text or any other elements (html and css) to suit your taste.

Setup without starter code:

1. Create a directory for your flying_newspaper in today's morning_exercise folder.
2. Create an index.html and main.css files within that folder.
3. Using only HTML and CSS (no JavaScript or jQuery!), make a div with a class of newspaper.
4. Add CSS animations to make it fly like the given example.

My newspaper flies! I'm hungry for more!

1. Create a nav and make it look similar to this

or

2. Create some colored div elements and animate each one differently

Deliverable

Make something you'd enjoy sharing with the class at the end of this session!

Resources

Links

animista

Videos

CSS Transform
CSS Transitions
CSS Animations