I’ve created a calendar preview using a grid with ‘collections’ CMS functionality. All the interactions work as intended when hovering on and off the individual preview cards (thumbnail). The challenge I’m facing is once I’ve hovered over a thumbnail and then hover directly onto any neighboring thumbnail, the interaction clutters. In other words, the elements that are designed to show in a ‘hover off’ state appear even tho I’m hovering onto another thumbnail, which the interaction is set to hide those elements in a ‘hover on’ state. The two actions are now conflicting with each other.
Figure 1: Calendar in normal and ‘hover off’ state
Figure 2: ‘Hover on’ state
Figure 3: ‘Hover off’ state when hovering from one thumbnail directly onto the next
Any solutions would be wonderful. Here is the preview link just in case:
Thank you in advance!