Design comparison
Solution retrospective
Hey Everyone,
Sorry my files are a complete mess, this challenge taught me that I really, really need to organize my files better. :P
I did have one question, I was unable to figure out how to set the height of the bars with the animation, which is why the animation goes to 100% than jumps down to where the height is actually at. Hope that makes sense, and any help with this would be great.
Thanks!
Community feedback
- @devrianmendesPosted over 2 years ago
I set the height of the bar by taking the day value in the .json document and multiplying it by 2.5, so all the values in the document multiplied by 2.5 would give less than 200px height for each bar, even if the value changed later, the height of the bars would change according to the new values. If it was difficult to understand, take a look at my github in the challenge repository and look at the handleBar function.
0@12KentosPosted over 2 years ago@devrianmendes Thanks for the comment. :)
I was able to get the data out of the .json document, and set the height of each of the bars to that. The issue I have is when you look at the site, the height of each bar goes to 100% of it's container, then down to what they are supposed to be. I was having issues setting the animation of the bar growing and shrinking to the actual height I want it to be from the .json file instead of growing to 100% of the container height if that makes sense?
0
Please log in to post a comment
Log in with GitHub
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord