Gwt - label receives all events - html

I have a tooltip label near the cursor.
I have 2 problems which i am not sure how to fix:
When the mouse is above the label the cursor changes to text cursor. I want the cursor to not change.
The Canvas element does not receive any mouse event. It seems that the label receives the events.
How it can be fixed?

Cursor should not change over a label. Something wrong with your CSS: check in your browser which style has "cursor" in it.
If you don't feel like figuring it out, just set style "cursor: default" on your label (you may need to add !important; if it does not work.

Related

How to remove focus on dropdown button when you already moved mouse away from it?

When i click dropdown button and click it again for closing focus still remains. even when i move mouse away. How can focus removed for that case?
One possible solution is to remove the focus on the second click with the help of element.blur() - here are the related docs. You can add the class to the button on the first click and if the button has class (it will have on the second click) - just use blur.
But keep in mind, that some users want to interact with your site with the help of a keyboard, and removing focus will be annoying for them. Do you need focus to be visible on the button before opening the dropdown? Another possible solution is to remove :focus style from the element completely (outline: none), but it's not recommended.

Click event on checkbox not handled because of CSS animation

I have an input and a checkbox, when the input is focused it display some information under it.
The problem is : when those information are displayed if I click on the checkbox it hides the information (because my input is not focused anymore) but the checkbox is not checked.
Here is a working plunker which reproduce this behavior.
Is there a way to make the checkbox checked in this scenario ?
EDIT :
I think the problem is because the input loose the focus on the event mousedown and the checkbox is checked on the event mouseup (or maybe click) so when the mouseup event is fired the input has already lost the focus so the message under it is hidden and the checkbox moves up. So when the mouseup event is fired the cursor is not anymore on the checkbox, that's why the checkbox is not checked.
Nothing in pure CSS. You would need to bind focus event on JS.
Something like this:
var input = document.querySelector('#input');
input.addEventListener('focus', function() {
this.classList.add('focus');
});
And then change your CSS from :focus to .focus
My solution for your question is attached here. This is a simple way. I have added JQuery code to it. You can try this code. I have written this code using JSFiddle. The link is given below:
[https://jsfiddle.net/679g9p6p/1/][1]
If you want to hide the information when focus out from the textbox, then you can try this code given below:
[https://jsfiddle.net/xxsL2e03/100/][2]

How to change the cursor when over TLF text?

With any of the editable text fields such as RichEditableText, TextArea and any TextFlow containers the cursor is always the familiar text entry pipe character with serifs thing. Whatever.
I need to be able to change that to a hand cursor as it moves over an inline graphic image and then revert back to text entry cursor on mouse out.
I've been looking at the CursorManager class but have had no luck yet.
UPDATE:
I found a class FlowElementMouseEventManager that manages the cursor as it moves over a text flow container. It's not clear how to change the cursor to a hand cursor yet but the LinkElement will change to a hand cursor when the mouse is over it and the CTRL is held down.
Set buttonmode = true for that inline graphic image and you are good to go

AS3 - Removing the blinking cursor in text field

Can I remove this blinking cursor from a textfield?
Thanks,
Not in a INPUT Textfield.
You can still use some ticks with a Dynamic textfield which listens to KEY_UP events, but you'll have to do all the things by yourself (delete, home key, end key...), and you can forget about things like copy/paste, undo, mouse selection...
It's a tricky way. What can also work, is hide the textfield by setting its textcolor to the background color (so you won't see the cursor), or set its alpha to 0, then copy the text into another dynamic text field on KEY_UP events. Still, it's quite a hack.
Good luck.

How to Change Text Cursor Color of Text Input Flex 4?

I want to change the blinking text cursor color of Text Input in Flex 4...
How can I change it ?
Is there any way to handle it, or it can be only controlled by Flash Player ???
I had a similar question about this a while ago. I never found a way to update the actual cursor, so I got creative with the solution. My solution was to have two textfields stacked. One input field on top of a dynamic field.
Set the alpha of the input field to 0. Then, add a CHANGE event listener to the input field. In the handler, update the dynamic field and reposition your cursor based on the textWidth.
Not ideal, but it did the job.
I had solved this problem,
Actually there was a problem in skinning of text input.
If we set textinput skin's richeditabletext's alpha to 75 or some down value, flash player makes cursor color white itself.
So by increasing that alpha value, I got the cursor color black.
I change the TextField.textColor = OxFFFFFF, the cursor changes into white as well. Works for my case when I need the same color for the blinking cursor and text.