Design comparison
Solution retrospective
it wasn't easy to do the animation, i had to cheat with a litle js
What specific areas of your project would you like help with?is there any way of producing the shadow animation on hover only with html and css??? If yes please i would like to know how.
Community feedback
- @Alex-Archer-IPosted 5 months ago
Hi!
You choose the wrong pseudo-class. It should be
hover
instead ofaction
and than transition would work =)But I suggest you to specify which properties you want to be animated. I mean
transition: box-shadow .5s;
instead justtransition: .5s;
. In the second case all changing effects will be animated and sometimes it looks weird =)Marked as helpful0@IZY-BOYPosted 5 months ago@Alex-Archer-I thanks for the suggestion i will have a try of right a way
1@Alex-Archer-IPosted 5 months ago@IZY-BOY
You're welcome =)
I forgot to specify that
active
works when user click on the element andhover
- when they hover mouse over it.1@IZY-BOYPosted 5 months ago@Alex-Archer-I Yes i know, just that i was following the design images (it is written active-state)
1@Alex-Archer-IPosted 5 months ago@IZY-BOY
Hah, I didn't think about it that way, good catch =)
I really hope that they don't mean that though cos when user clicks on the link they are immediately redirected and never sees active effect =)
0
Please log in to post a comment
Log in with GitHubJoin 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