Make elements transparent when mouse out of them

Ignition
,
1

I have some buttons with the opacity set to 0.25

I want that if you hover the mouse the opacity is set to 1 so you can see clearly the buttons.
I tried this:

onMouseEnter:
	self.props.style.opacity = 1

onMouseLeave:
	self.props.style.opacity = 0.25

But the buttons for some reason blink (?).

Any idea?
Thx!

2

Do you have text on the button? I’m pretty sure that will trigger the onMouseLeave.

Do you have any other mouse events or bindings on your styles that are conflicting?

1 Like
3

it was overlaping another component because I was trying negative margin and that was causing it. I changed it and now works correctly.

Thx for the help!

4

Mouse events are very unreliable because the scripting doesn’t run in the browser. You should use the Style Class “hover” state:

image
image386Ă—279 14.3 KB

5 Likes