Mouse Over an element inside an app

My class is working in APP lab…A student of mine was wondering if you could have text appear when you mouse over an element.

The student could create a label that stays hidden till a “mouseover” event occurs. The label is hidden again when a “mouseout” event occurs. Use the showElement and hideElement functions.

I too am having the same issue with my code

Cannot understand what the problem is, events are getting triggered . but the gif doesn’t change
Help would be greatly appreciated

Hey @gauri.parulkar, that’s a real interesting program! When you slow down the code, you can see the image change. I don’t know if adding some sort of a delay in the code would help.

I don’t think “mouseover” and “mouseout” work exactly right. You can get multiple mouseover and mouseout events while the mouse stays over the label. That seems intuitively wrong. It violates the Principle of Least Astonishment.

What I would try is a mousemove event handler that checks the mouse coordinates against the label location and size. You can get the label’s x, y, width and height properties from the label for comparison so you can move the label and resize it without breaking the code.

Some phones like the Samsung phones do not respond to mouseover nor mouseout unless you attach a mouse.

Thanks. I missed closing the loop on this. I learnt that mouseover fires just once and hence when clubbed with mouseMove one fails to notice that mouseOver has triggered as many times the event is slight and shadowed by mouseMove. Hence it is wise to have mouseOver an mouseOut in an app and mouseMove in another app if possible.
Either ways mouseMove is a more frequent use case.

Also the properties of the UI element on which mouseOver is used play an important role. The width of the control etc as such, if the control has a thick border then the mouseOver is likely missed.

Anyways, thank you. This is solved