I appreciate the input, Erik, but the CSS I posted is for standard GWT functionality. Rollover effects based on the GWT CustomButton class appear to be unreliable, apparently because the ON_MOUSE_OUT event isn't always fired. Those CSS rules are described here:
http://google-web-toolkit.googlecode.com/svn/javadoc/1.6/com/google/gwt/user/client/ui/CustomButton.html http://google-web-toolkit.googlecode.com/svn/trunk/user/src/com/google/gwt/user/client/ui/CustomButton.java http://google-web-toolkit.googlecode.com/svn/javadoc/1.6/com/google/gwt/user/client/ui/UIObject.html On Sep 7, 12:16 am, Erik <[email protected]> wrote: > You don't need mouse-over listeners to trigger hover-effects, you can > also use css pseudo-classes: > (seehttp://www.w3schools.com/CSS/css_pseudo_classes.asp) > > .basis-menubutton > { > border: 1px solid transparent; > cursor: pointer; > background-color: transparent; > text-align: center; > vertical-align: middle; > padding: 0px; > overflow: hidden; > > } > > .basis-menubutton-border > { > border: 1px solid #cbcbcb; > > } > > .basis-menubutton-down:HOVER > { > border: 1px solid #909090; > background-color: #cacaca; > > } > > .basis-menubutton-up:HOVER > { > border: 1px solid #cbcbcb; > background-color: #e8e8e8; > > } > > On Sep 4, 10:33 pm, Jim Douglas <[email protected]> wrote: > > > > > I've got a set of button rules to change the background color on > > rollover (CSS below, but it's nothing exotic). It works if you just > > move the mouse in and out of the button; the CustomButton code to > > toggle setHovering(boolean) is triggered, and everything is good. > > > But if something happens to suppress the ON_MOUSE_OUT event, > > setHovering(false) is never invoked, so the button retains the > > rollover background color until you explicitly trigger ON_MOUSE_OUT by > > dragging the mouse in and out of the button. This situation can > > easily happen when clicking the button invokes a modal dialogue > > window, or when the button is at the edge of a window. > > > This seems like a GWT bug, although possibly caused by inherent > > browser limitations. I'd expect setHovering(false) to be invoked when > > the mouse is no longer hovering over the button, as opposed to just > > the subset of cases where the user drags the mouse out of the button, > > triggering the ON_MOUSE_OUT event. > > > Does anyone know of any workarounds? > > > .basis-menubutton > > { > > border: 1px solid transparent; > > cursor: pointer; > > background-color: transparent; > > text-align: center; > > vertical-align: middle; > > padding: 0px; > > overflow: hidden;} > > > .basis-menubutton-border > > { > > border: 1px solid #cbcbcb;} > > > .basis-menubutton-down-hovering > > { > > border: 1px solid #909090; > > background-color: #cacaca;} > > > .basis-menubutton-up-hovering > > { > > border: 1px solid #cbcbcb; > > background-color: #e8e8e8; > > > } > > > // From CustomButton: > > > case Event.ONMOUSEOUT: > > Element to = DOM.eventGetToElement(event); > > if (DOM.isOrHasChild(getElement(), DOM.eventGetTarget(event)) > > && (to == null || !DOM.isOrHasChild(getElement(), to))) { > > if (isCapturing) { > > onClickCancel(); > > } > > setHovering(false); > > } > > break; > > case Event.ONMOUSEOVER: > > if (DOM.isOrHasChild(getElement(), DOM.eventGetTarget(event))) > > { > > setHovering(true); > > if (isCapturing) { > > onClickStart(); > > } > > } > > break; --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [email protected] For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en -~----------~----~----~----~------~----~------~--~---
