New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Advanced HTML and CSS - Keyframes: Animate transform instead of width and height #27788
Comments
Thanks @royalh23, @TheOdinProject/html-css can we get you're input on this one please? |
I think it makes sense to use a transform there instead. Don't think that's a differentiation that's important to include, and I can't think of many cases with that kind of animation where you'd purposely want to just change the width/height and not just scale the whole thing. Since the lesson says The codepen will need to be changed accordingly as well. |
Going to assign you @royalh23. I think changing the height/width adjustment to simply We will handle the codepen on our side so both parts are changed at roughly the same time. |
@MaoShizhong Gotcha. Will make a PR tomorrow |
Checks
Describe your suggestion
I was doing the Keyframes lesson and realized that instead of using
transform
toscale
the ball in the last example,width
andheight
properties are animated instead. We've already been taught that animating any properties other thantransform
andopacity
are expensive, and thus I think animatingwidth
andheight
in the lesson might confuse some learners. Here's the relevant code snippet:Path
Node / JS
Lesson Url
https://www.theodinproject.com/lessons/node-path-advanced-html-and-css-keyframes
(Optional) Discord Name
No response
(Optional) Additional Comments
No response
The text was updated successfully, but these errors were encountered: