Level 104
You only need the hover: modifier on scale:
transition duration-1000 scale-100 hover:scale-105
Now whenever you hover it will scale up; and whenever you leave, it will scale down
1 like
Mar 29, 2022
6
Level 4
Opposite of Hover in Tailwind?
Hi all,
Does anyone knows how to have an effect on when the mouse leaves please? Ieg:
hover:transition hover:duration-1000 hover:scale-105
What would be the opposite please when the mouse leave? I would the elements to come back to their position with:
hover:transition hover:duration-1000 hover:scale-100
In pure CSS it seems to be: not:hover
But I cannot get it to work with Tailwind.
Thanks!
Level 4
@tykus When I hover over the image, the duration animation works as expected but when I move my mouse out, the animation does not scale back with a duration, it scales back right away.
Level 104
@User1980 show your markup
Level 4
@tykus I just realised you removed the hover, yes this makes sense now! Thanks again
Level 102
When you dont hover it, it should just use the default css? What specifically do you need it to do?
1 like
Level 4
@Sinnbeck Thanks, When I hover it, the duration animation works as expected but when I move my mouse out, the animation does not scale back with a duration, it scales back right away.
Please or to participate in this conversation.