freeCodeCamp's Animate Elements at Variable Rates, Applied Visual Design

Channel:
Subscribers:
8,020
Published on ● Video Link: https://www.youtube.com/watch?v=_WCMDeYnh38



Duration: 2:04
58 views
0


In this lesson from freeCodeCamp's Applied Visual Design section we look at altering the keyframes of a div with a class of star-1. Currently the stars were animating at the same time, but once we change the animation rate, the stars twinkle at different rates




Other Videos By We Will Code


2018-11-02freeCodeCamp's Intro to Javascript, Compound Assignment & String Literals (3)
2018-10-31freeCodeCamp's Make an Image Responsive,Web Design Principles
2018-10-30freeCodeCamp's Introduction to Javascript, Math Operators in JS (pt.2)
2018-10-29freeCodeCamp's Introduction to Javascript, Comments, Variables, & Casing
2018-10-29Create a Media Query, Responsive Web Design
2018-10-28freeCodeCamp's Make Motion More Natural Using a Bezier Curve
2018-10-28freeCodeCamp's Use a Bezier Curve to Move a Graphic, Applied Visual Design
2018-10-28freeCodeCamp's Learn How Bezier Curves Work, Applied Visual Design
2018-10-26freeCodeCamp's Change Animation Timing with Keywords, Responsive Web Design
2018-10-25freeCodeCamp's Animate Multiple Elements at Variable Rates, Applied Visual Design
2018-10-25freeCodeCamp's Animate Elements at Variable Rates, Applied Visual Design
2018-10-14freeCodeCamp's Make a CSS Heartbeat using an Infinite Animation Count
2018-10-14freeCodeCamp's Animate Elements Continually Using an Infinite Animation Count
2018-10-10freeCodeCamp's Create Visual Direction by Fading an Element From Left To Right
2018-10-09freeCodeCamp's Create Movement Using CSS Animation, Applied Visual Design
2018-10-04freeCodeCamp's Modify Fill Mode of an Animation, Applied Visual Design
2018-10-04freeCodeCamp's Use CSS Animation to Change the Hover State of A Button, Applied Visual Design
2018-10-01freeCodeCamp's Create a More Complex Shape Using CSS and HTML
2018-09-30freeCodeCamp's Create a Graphic Using CSS, Applied Visual Design
2018-09-28freeCodeCamp's Use the CSS Transform Property skewY to Skew
2018-09-28freeCodeCamp's Use the CSS Transform Property skewX to Skew an Element Along the X-Axis



Tags:
CSS keyframes
@keyframes
css animation
animation duration
infinite animation count