The hover event is very “aggressive” and reacts instantaneously. I have an accordion which expands on hovering. However, it makes it hard to scroll the entire list.
I wish I could set a delay time for the “on hover” event which serves as a sensitivity setting. You would need to hover over a specific object a certain time (= user setting in ms), before the event is actually triggered.
This would be absolutely fantastic and is hopefully not hard to implement.
Thanks for this tip!
I used the mouse-enter and mouse-leave events instead and it worked almost perfectly. But now I encounter a new issue:
The mouse-enter event uses a time-delay of 600 ms whereas the mouse-leave event does not have any delay. When I move the mouse from one just expanded card directly into another (collapsed) card with no white space in between (border touching border), the card which just expanded should collapse immediately and the card just entered should expand with a little delay.
Instead, the old card stays open until the new card is expanded and only then the old card collapses. This behaviour was not intended and it seems to me that the delay for mouse-enter event delays “everything” but should actually not affect the animation of the other component, for my understanding.
If I move the mouse to the side and not directly into a new interactive card, the mouse-leave event is executed as expected: the old card collapses immediately.
The mouse-enter event with its delay seems to be executed before the mouse-leave event can be executed but the two events should be executed independently, I think.