CODEWITHSUNDEEP
gwtvaadinmouseovermouseout
tonix
tonix

Reputation: 6939

GWT MouseOverHandler and MouseOutHandler horrible result, element keeps fire mouse over and mouse out events at the same time?

I have a problem with the GWT MouseHandler events:

This the code:

@Override
    protected void extend(ServerConnector target) {
        final Widget widget = ((ComponentConnector) target).getWidget();

        widget.addDomHandler(new MouseOverHandler() {
            @Override
            public void onMouseOver(MouseOverEvent e) {
                widget.setVisible(false);
            }
        }, MouseOverEvent.getType());

        widget.addDomHandler(new MouseOutHandler() {

            @Override
            public void onMouseOut(MouseOutEvent event) {
                widget.setVisible(true);
            }
        }, MouseOutEvent.getType());
    }

I am using Vaadin, this is inside the an extension connector. The hovered element is a simple label. Everything works great when I either use only the MouseOverHandler or the MouseOutHandler, but when I use them together I get this horrible result (please, take a look at the video to understand what I mean):

http://tinypic.com/player.php?v=jrxpq0%3E&s=8#.VMSkFnCUc4Q

Why does MouseOverHandler and MouseOutHandler do so when they are together?

Upvotes: 1

Views: 1017

Answers (1)

raffael
raffael

Reputation: 2456

This has nothing to do with gwt. You are hiding the widget, when the mouse is over it. When the element hides, the mouse is not over it anymore and so the mouseOut event is triggered, which makes the widget visible again. This will trigger the mouseOver event again and the loop begins again.

It is basically this: 

<div onMouseOver="this.style='visibility:hidden;'" onMouseOut="this.style=''">blub</div>

Or on jsfiddle to play around: http://jsfiddle.net/9cwsqca4/

Upvotes: 1

Related Questions