What does a CSS transform allow the developer to do to an element?
The transform technique was introduced with CSS3 which reimagined the idea of altering elements such as with size position and even changing the elements themselves. It comes in two different setting types, two dimensional and three dimensional. And of course each one comes with their own respective list of properties and values they can respond to.
Prodive and example of a transform and how you could see that being used on a website.
2D rotate is an example of what transform is allowed to manipulate. It rotates the element up to 360 degrees, and I could see this being used on a website via a button giving the user the optiont to rotate an image either for amusement or for a picture game of rotating sections to fit a picture.
What does a CSS transition allow the developer to do to an element?
Transitions are typically associated with changes to an element whether that be a color change or a font size change. The transition basically assigns a time frame in which the change will occur such as 1 sec to 1 minute, usually involved with a click or a hover influence.
How does the CSS animation differ from a CSS transition?
Animations are similar to transitions but not the same in that an animation will utilize multiple transitions to create a streamline of image changes resulting in an animation. One transition may change the font size to large on hover while another may slowly change the color after the increase. The animation will take both and convey it in a seamless manner as if it were a video.
What are some benefits to using CSS transitions on websites?
Transitions will allow user interactivity to the website making them feel more involved. It will also increase conversions of the website.
How this topic fit in with your long term goals?
This is a topic I was genuinly excited to learn about because I think it’d be really cool to create a website where animations run without user input but it all be done using code. For example lines of text shrinking down to fit into a space and then rotating to implicate that of a solar system would be pretty neat.
The limitations to what transitions and animations can handle before the code derails or fails. What the major difference between utilizing grow&shrink as opposed to just changing the values of the width and height of the object.