Tuesday, August 30, 2011

Re: Why doesn't my custom widget work in chrome but perfectly in firefox?

Use MouseMoveHander and MouseOutHandler instead of
MouseOverHandler,MouseOutHandler. See the following code. Hover the
cursor to the div, the text responds to mouse over. Remove the
cursor from div to get "bye mouse".

S. Abraham
www.DataStoreGwt.com

package com.college.client;
import com.google.gwt.event.dom.client.MouseMoveEvent;
import com.google.gwt.event.dom.client.MouseMoveHandler;
import com.google.gwt.event.dom.client.MouseOutEvent;
import com.google.gwt.event.dom.client.MouseOutHandler;
import com.google.gwt.user.client.ui.HTML;
import com.google.gwt.user.client.ui.RootLayoutPanel;
public class MyWidget
{
private final HTML widget;
public MyWidget() {
widget = new HTML("<div>Hello</div>");
widget.addMouseMoveHandler(new MouseMoveHandler()
{
@Override
public void onMouseMove(MouseMoveEvent event)
{
widget.setHTML("<div>Mouse over</div>");
}
});
widget.addMouseOutHandler(new MouseOutHandler()
{
@Override
public void onMouseOut(MouseOutEvent event)
{
widget.setHTML("<div>Bye mouse!</div>");
}
});
RootLayoutPanel.get().add(widget);
}

}

On Aug 30, 3:08 am, Ingert Doe <inge...@gmail.com> wrote:
> Hello, Today I ran into some problems with a custom widget. I created
> a new GWT project and made a small test widget to narrow down the
> problem. Here is the test widget I wrote:
>
> public class MyWidget extends Composite implements MouseOverHandler,
> MouseOutHandler {
>         private final HTML widget;
>
>         public MyWidget() {
>                 widget = new HTML("<div>Hello</div>");
>                 widget.addDomHandler(this, MouseOverEvent.getType());
>                 widget.addDomHandler(this, MouseOutEvent.getType());
>                 initWidget(widget);
>         }
>
>         @Override
>         public void onMouseOver(MouseOverEvent event) {
>                 widget.setHTML("<div>Mouse over</div>");
>         }
>
>         @Override
>         public void onMouseOut(MouseOutEvent event) {
>                 widget.setHTML("<div>Bye mouse!</div>");
>         }
>
> }
>
> In firefox, this code works as expected. When I hover the cursor over
> the div, the text changes to "Mouse over", when I remove the cursor
> from the div, the text changes to "Bye mouse!".
>
> In Chrome, only the onMouseOver handler is executed. To be perfectly
> clear: When I hover the cursor over the div, the text changes to
> "Mouse over", but when I remove the cursor from the div, the text does
> Not change to "Bye mouse!".
> If I comment out the addDomHandler for MouseOver, the MouseOut works.
>
> I have also tried (as suggested on different forums) to only implement
> the HasMouseOverHandlers and HasMouseOutHanders on my widget,
> overriding the addMouse*Handler and using a separate class for
> implementing the MouseOverHander/MouseOutHandler but I get the same
> results here. Works perfectly in ff but only one handler works in
> chrome.
>
> Am I doing anything wrong in the code above? Is there another way I
> can write the code to get the it more cross-browser compliant?
>
> Thank you!

--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To post to this group, send email to google-web-toolkit@googlegroups.com.
To unsubscribe from this group, send email to google-web-toolkit+unsubscribe@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.

No comments:

Post a Comment