Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Posted by Leon Kenedy
Leon Kenedy
Courses Plus Student 9,149 Points

Can you help me with this code challenge?

Here is the link. I need the code to all 3 stages please and thank you. Here is the link.

http://teamtreehouse.com/library/css-foundations/css-animations/keyframe-rules-and-animation-properties-webkit-only

1 Answer

Carlos Quivera
Carlos Quivera
6,917 Points
Carlos Quivera
Carlos Quivera
6,917 Points 
/* Complete the challenge by writing CSS below */

.prog-bar {
 -webkit-animation: slide;
 -webkit-animation-duration: 2s;
 -webkit-animation-timing-function: linear;
} 

/*  Keyframes
------------------------------------------ */

@-webkit-keyframes slide {
    0%   { width:   0%; }
    30%, 
    60%  { width:  50%; }
    70%  { width:  80%; }
    100% { width: 100%; }
}

There you go. :) When you feel stuck, I suggest you to review the previous videos to get a better understanding, it gets a lot clearer when you watch the videos a few times.

Leon Kenedy
Leon Kenedy
Courses Plus Student 9,149 Points

I just figured it out. Sorry, I will still give you best answer though.

Carlos Quivera
Carlos Quivera
6,917 Points

Awesome :) I'm glad you figured it out!

~Cheers!