Daily Reading 14
What does a CSS transform allow the developer to do to an element?
the “transform” function allows for the movement, rotation, and scaling of various 2d or 3d visual elements on your webpage, using CSS.
Provide an example of a transform and how you could see that being used on a website.
A quick transform could be used in a header nav bar, where hovering your mouse over a section in the nav bar lowers a dropdown menu that gives more granular options. Such as, a store label on the nav bar, that when hovered, brings down a menu that has links to the store’s shirts page, mugs page, and posters page.
What does a CSS transition allow the developer to do to an element?
Allows the developer to add visual effects that do not involve object movement/rotation/scale to visual elements, that take place over a gradual duration. An example would be a button smoothly changing color and shape over the span of 1 second upon hover.
How does a CSS animation differ from a CSS transition?
An animation has support for pre-defined in-between states that should be transitioned between, while a transition is from only one to another. These pre-defined in-between points may better be known as Keyframes, and play a core role in animation, both 2D and 3D.
What are some benefits to using CSS transitions on websites?
Visual presentation is vital to a website’s design, and making sure you make smart and effective use of your tools to create a memorable and easily understood site will make your clients, and your clients vistitors happy.
How this topic fit in with your long-term goals?
Learning better how to make visually pleasing and simple interfaces will give me a better chance of being noticed by game companies in regards to making their websites. I’ve noticed that a lot of them sometimes make novelty websites that more give a fantastical visual treat that highlights the concepts and visual style of the game over simplicity and navigation. One big, extremely flashy page, over several small basic pages. the website for Cult Of The Lamb comes to mind as being a great example of a game promotion site that values flashy over all else.