Can element size controlled by CSS or JS?



Hello guys, I am a newbie with Hype and codes. I created a Navigation, which is a group “element” of text. How would I control the “Height of that element” by css or javascript? I would like to interact it with scrolling, like it is disappear while start, but gradually appear from button to top triggered by the user to scroll the page. (ps: not just made by timeline, opacity change or css clip property.)

like the left bottom navigation element of (17.8 KB)

Thanks a lot!!!


Hi @motchiual,

I’m not quite following what you’re after, but I’ll throw this on the wall to see if it sticks.

Under Tab 3, you can set the Overflow to scroll:


Here’s an example file: (203.6 KB)

(Jonathan Deutsch) #3

Hype element position/sizing can be controlled in JavaScript via the hypeDocument.setElementProperty() API. Please see this section of the documentation. There are keys for "top", "left", "width", and "height".

Example usage:

var myElement = hypeDocument.getElementById("myUniqueID");
hypeDocument.setElementProperty(myElement, "left", 100);


Hello O, thanks, it’s good for inspire… ^^


Hi Jonathan, it’s work! Thanks! However I find out it seems not the right way to make the parallax effect that I like to, haha, I am trying another method… Thanks anyway!!

(Rick) #6

Maybe this will help:


woo, thanks Rick, such a cool kit would be useful in someday ^^