Reading Notes for Day 14 of 201:
Reading CSS Transforms
- What does a CSS transform allow the developer to do to an element?
Transform allows developers to rotate, stretch, skew and generally change the appearance of html elements.
- Provide an example of a transform and how you could see that being used on a website.
One example, rotate, would be a fun way to make pictures more visually interesting. I could also see using stretch to change the appearance of a particular item, like a ladder.
Read CSS Transitions & Animations
- What does a CSS transition allow the developer to do to an element?
Transitions allow developers to alter the appearance of an object when a change in state (such as a hover or a click) occurs. The transition won’t happen until the change in state happens.
- How does a CSS animation differ from a CSS transition?
A transition is good for a single state change, animations allow for multiple state changes. So changing colors is good for a transition, but moving across a screen is more likely an animation.
8 simple CSS3 transitions that will wow your users
- What are some benefits to using CSS transitions on websites?
They excite and engage users and increase the likelyhood that the user will do what you want them to on the site.
- How this topic fit in with your long-term goals?
Using tools like transitions and animations can make visiting a site I visit more interesting. I would like my sites to be interesting, especially my portfolio pieces. Also I want to be able to demonstrate as many disparate skills as possible.
Bookmark/Skim Pure CSS Bounce Animation, 6 Buttons animated, CSS3 Animations: Keyframes, 404
Things I want to know more about
I’d like to read more about animations. I’ve seen sites where a ball bounces on a click and stops with another, and I want to build something like that.