Forum Discussion

Jim_Arbon's avatar
Jim_Arbon
Community Member
30 days ago

New JavaScript API - set opacity not working

The new JavaScript API is pretty great! I've already improved on a funky new project that I'm working on.

I have found a small bug though - setting the opacity (or alpha) property of an object doesn't visually change the object - i.e., it's still visible.

I added a basic shape and a reference to it in a new JS trigger on a button click, then used this to set the opacity to 0, but I can still see the shape:

const rectangle1 = object('6AGhckCeMO2');
rectangle1.opacity = 0;

If I console.log the object and invoke the opacity property getter, it shows '0', so it is affecting the object, but the JS object's opacity isn't changing the visibility of the slide object.

To work around this I can create a new state that has nothing in it (and give it a custom name that isn't one of the built-in state names to work around another bug), then call rectangle1.state = "HiddenSL"; on it and it visually disappears. However, I have hundreds of objects that I'd like to show and hide, so I would rather not create a new state on all of them. Another workaround is using the old technique to access the HTML element using the data-acc-text property and calling .hidden on it, but let's fix up this new JavaScript API, yeah? :)

3 Replies

  • Hi, 0 dont work, but if you want your object totally invisible, use -1 ...
    Logical :)

  • Jim_Arbon this does appear to be a bug, I encountered it on Thursday actually but it was on a very strange project so I wasn't 100% sure that it was across the board (it is). The clean workaround is to use "style" 

    object('6AGhckCeMO2').style.opacity = 0; 

    If you need the opacity to resume you can use (instead of 0):

    object('6AGhckCeMO2').opacity = 0.001;

    Thankfully this is an easy issue to resolve and will certainly be fixed in the next update.