Mouse In/Out doesn´t work

Hi!

I have simple box shape. I give the name “box1”. I want to be shown on mouse in and not shown in other situations. I used this code:

export function box1_mouseIn(event) {
$w(‘#box1’).show();
}

and

export function box1_mouseOut(event) {
$w(‘#box1’).hide();
}

I tried with object hidden (doesn´t show when you go with mouse over the place where it is) and with not hidden (it case box is always showing regardles of mouse motion).

Thank you in advance for your help!

Hi,

Your code looks correct. Please make sure that the export functions were set up through the properties panel of the element.
If you write it directly in code panel it won’t work, you need to set it up through the properties panel of the element, see the example on the screenshot below:

If the issue persists, please send the link to the editor of your site and the name of the page with the issue.

I hope this was helpful, don’t hesitate to get back to us if you need further assistance.

Thank you for your response!

The problem was that I didn´t connect objects properly. When I used mouse in/out on the source object the box shown. So the code was correct only connected in the wrong place.

I have a similar problem. I try to get a ‘plus’ to turn when you hover it and combined with that to have some text appear. The text appears just fine, however the ‘+’ doesn’t turn. What do I do wrong?

export function Plus2_mouseIn(event) {
let turnOptions = {
“duration”: 250,
“direction”: “right”
};

$w(“#Plus2”).show(“turn”, turnOptions);
$w(‘#Text1’).show();
}

export function Plus2_mouseOut(event) {
let turnOptions = {
“duration”: 250,
“direction”: “left”
};

$w(“#Plus2”).show(“turn”, turnOptions);
$w(‘#Text1’).hide();
}

Hope you can help!

Hi mark, as in the previous case, please make sure that your export functions were added through the element’s properties.
Also, please try using longer duration for the turn effect.
If the issue persists, please send the link to your editor and the name of the page with the issue.