react-popover
react-popover copied to clipboard
jasonkuhrt
Is there good example for onMouseOver\onMouseOut binding?
I have the same question and only could resolve for myself by the following way 1 - Write wrapper for popover body {div} 2 - Handle onMouseOver/Enter in the wrapped div 3 - add css styles {overflow-y: auto; width: 100%; height: 100%; padding-right: 20px} for the wrapper
I'm not sure I fully understand what you are asking for here. Are you wondering how to use onMouseOver and onMouseOut on the popover body?
@jasonkuhrt Question is about closing the popover when the mouse leaves the popover body (possibly with a delay).
It seems like you should be able to just pass onMouseOver et al to https://github.com/littlebits/react-popover#standard and voila. Is that not working? Am I misunderstanding the ask?
@jasonkuhrt I can't get events such as onMouseOver et al to work on the Popover-element. Can you?
If you hover over the triggering element, the popover body appears. If you then move your mouse to the popover body, it is still displayed. Only when you move your mouse outside the popover body, it disappears.
With onOuterAction, you can make the popover body disappear easily when clicked outside the popover body. But it isn't triggered when the mouse just moves outside the popover body.
I eventually managed to get a working solution myself. This does the job for me, but improvements/comments are always welcome,
But it isn't triggered when the mouse just moves outside the popover body.
Right, because onOuterAction is defined as a click/tap, not simply movement.
Are you saying you want a prop like onOuterMovement that you could hook into any time the user has moved outside the popover?
Have a look at react-popover-wrapper. This is a wrapper component I use to easily allow click, hover and hoverDelay triggers.
@MrBlenny Cool. I'm glad I clarified the issue. As for ETA I don't know. Right now my spare-time efforts are largely going into https://github.com/jasonkuhrt/forto.
