Mouse in & mouse out

First, I have a box and text elements. Then I group the text inside the box and called #box1. Second I wrote a code when mouse in the box. Third, I wrote another code for mouse out the box. And here are the codes
$w . onReady ( function () {
});
export function box1_mouseIn ( event ) { $w ( ‘#box1’ ). show ;
}
export function box1_mouseOut ( event ) { $w ( ‘#box1’ ). hide ;
}
Basically I wanted, when a mouse inside the box, the text and the box appear. And when the mouse is out of the box, text and box disappear. I have no idea why it doesn’t work. Any help please. Thanks

Hi @hl1 ,

There is a huge logical misconception.

If the box1 is hidden, how it is possible to mouseIn?

I would recommend to change box1_mouseIn into other element’s mouseIn, which means you can put a exact same size element just under box1, and it is always visible (or transparent, but not hidden) to achieve mouseIn detection.

Keep the same for box1_mouseOut

Does it solve your question?

Certified Code Logo

YES IT WORKS! thanks very much. I used the #image1 instead of the #box1.
:sweat_smile: