Set element property inside innerHTML box


(Thiago Ribeiro Nogueira) #1

Hi!

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
#2

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

Sorry,

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?


#4

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

Ok,

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