Set element property inside innerHTML box

(Thiago Ribeiro Nogueira) #1


I need to set the property (opacity, for example) of a specific paragraph inside the innerHTML.

I saw that we can get the element by ID on this topic.

But how to use the hypeDocument.setElementProperty ?

Re-use functions

The quick way to do this is to use CSS within the Inner HTML:

But you could also set a class by using <p class="opacityhalf">my text</p>

And then adding that opacity class and property in the <head> of your document.

(Thiago Ribeiro Nogueira) #3


I forget to tell that I want to animate this 0 to 100 opacity like we can do with the setElementProperty method.

There’s a way?


The element would need to be its own element (selectable in the element list) and addressable with a Unique Element ID to use the Hype animation API via JavaScript.

Alternatively, you could use regular CSS + JavaScript to apply a class to the object which sets a fade transition:

This would allow you to set this property alongside any Hype API functions.

(Thiago Ribeiro Nogueira) #5


I will separate them in individual elements. Thank you for the help!