Name: CSS & JavaScript Animated Add To Cart Button
Uploaded: 2022-05-30T18:52:00+00:00
Duration: 16 min 22 s
Description: Welcome back to another of my Frontend Challenges. In today's frontend challenge, we're going to build an animated add to cart button with 3 different states: a regular state that displays our call to

3 years ago

Welcome back to another of my Frontend Challenges. In today's frontend challenge, we're going to build an animated add to cart button with 3 different states: a regular state that displays our call to action button text, a "loading" state that lets the user know we are adding the product to the cart, and then finally an "added" state to confirm that product has been added to the cart.

My website
https://www.pixelrocket.store

Download project files (you need this if you want to code along):
https://www.dropbox.com/s/irif55v0u1vwdpt/Day%20Ten%20-%20Add%20To%20Cart%20Button.zip?dl=0

30 Days Of Frontend Playlist
https://www.youtube.com/playlist?list=PLCvPStjGyw0eIMVhkIyy7Xyu90vNZwjPr

Timestamps
0:00 Intro
1:28 Setup Button HTML
3:00 Setup Initial Button Styling
3:52 Setup Button Javascript
8:30 Add Button Animations