I was trying to put together a “1 item at a time” type interaction in a prototype, and trying to find a work around for there not being a “click outside” and discovered what I think is an interesting limitation to interactive components: some reactions only work on the top most interactive component in a stack.
See this prototype for what I’m describing
Overlapping Interactive Components (Prototype)
Overlapping Interactive Components (File)
Reactions
-
On Click Only top component -
On Drag Only top component
-
While Hovering Affects all interactive components being hovered over. -
While Pressing Only top component
-
Keypress Only top component (This one really surprised me)
-
Mouse Enter/Mouse Leave Affects all interactive components that the mouse has entered/left
-
Mouse Down/Mouse Up Only top component
-
After Delay Affects all interactive components on the page