Support secondary hover states for multiple menu depths
I noticed I cannot put a Hover-Interaction on a component to trigger an overlay. When I use Hover, it only allows switching between states. And when I set a new Element and try to let it trigger an Overlay, the Option "Hover" is not even given in the Interaction-Menü.
Is this a bug or a non-improvement?
I see that some of the people who have responded are looking for hovers for elements, which is already supported via hover states: https://twitter.com/elainecchao/status/1194695173499830273?s=20 This specific request seems to be focused on supporting secondary navigation where there might be overlapping edges. I’ll keep this open for the latter use case.
JD Gimzek commented
Yeah, gonna have to say this is a huge oversight and definitely causing me issues in my first week switching from Sketch/Invision to XD
I am doing rollovers for a US map, and the states all overlap each other because Hover as Interaction turns off when using an overlay.
I am not going to take the time to work around it and will simply limit the interactions for the demo. Please prioritize this feature, as it is useful for many interactions of complex diagrams.
This is a staple interaction in InVision. How else do you mimic flyout navs and menus that appear on hover? Click does not work because often times the main nav item is a link and the flyout nav contains separate links.
To have Hover as a Trigger option (on interaction menu) would be really helpful, it allows more complex prototypes. Protopie does it perfectly.
Meanwhile my user testing quality is been negatively affected by it, I can't achieve a high-fidelity prototype.
Jumping in to leave a vote for hover interactions. Would be helpful for tooltips and menu dropdowns for my use case.
Jumping into this to ask for this also, many websites use Hover nav triggering different elements that cant be added to a component. Making a hover a click for prototyping isn't representative of the actual experience.
Nathaniel Platts commented
Vertical navigation is where this becomes very problematic. As the commenter below has stated, when creating a secondary nav menu on hover, it overlaps the other links below making this functionality useless.
Really need this to be possible for my prototypes. Right now I'm at a difficult place where I can't move forward on a project till I find a work around :(
Yeah I need that functionality too. We need hover over actions for a lot of things like tips, menu highlight, etc.
When you select Trigger: Hover, then Action, Type:Overlay, it automatically reverts Trigger:Hover to Trigger:Tap.
I have an issue where I want to show some text (A, B, C) on hover of 1, but once goes to hover, the touch target expands to the full area of the state and overlaps the other hover touch targets (2, 3)
This feature would allow us to make menus where, as you hover each navigation item, a different related image can appear on the side. Similar to this website: https://jacobmckee.com/index where, as the mouse hovers over the list on the right, a related video is displayed on the left.
Thomas Bonamy commented
Component have a lot of bugs when there is multiple instances of them (Example: Open dropdown; roll over; choose the option; validate; close dropdown etc).
The other things is about the rollout effect: When I set up a rollover effect on a specific element or group of elements inside a component, the rollout effect is not on the specific element or group of elements that I selected before for the rollover but on the entire component. It's not logical and realistic effect in the case we have a component with multiple instances inside (Example: Dropdown for filter: I open it, I have several choices with checkbox and a validation CTA. The roll over that I set up on each of these check box works well but the rollout works only if my pointer goes out of the entire component and not out of the checkbox).