freeCodeCamp Challenge Guide: Use CSS Animation to Change the Hover State of a Button

Guide
1

Use CSS Animation to Change the Hover State of a Button

This is a stub. Help the community by making a suggestion of a hint and/or solution. We may use your suggestions to update with more detail.

Problem Explanation

This summarizes what need to be done without just restating the challenge description and/or instructions. This is an optional section

Relevant Links

Hints

Hint 1

Hint goes here

Hint 2

Hint goes here

Solutions

Solution 1 (Click to Show/Hide) 
<style>
  button {
    border-radius: 5px;
    color: white;
    background-color: #0F5897;
    padding: 5px 10px 8px 10px;
  }

  button:hover {
    animation-name: background-color;
    animation-duration: 500ms;
  }

  @keyframes background-color {
    100% {
      background-color: #4791d0;
      }
  }

</style>

<button>Register</button>

Code Explanation

  • Code explanation goes here
  • Code explanation goes here

Relevant Links

11 Likes