How do I make my images or Elements work in Parallax format without having to use the HTML widget?

Hello I am a Thailand man who is not good at English. Will try to communicate with you. Thanks for reading my message.

How do I make my images or Elements work in Parallax format without having to use the HTML widget?

Parallax Edit 1.0.zip (200.1 KB)

you can put your code and styles into the head. create a rectangle and put there your “div” only.

<div id="scene" class="scene"> <div id="scene" class="layer" data-depth="0.15"> <img src="${resourcesFolderName}/iphone2.png"> </div> </div>

create a function onSceneLoad:

      $('#scene').parallax();

You might want to check out this blog entry:

Tumult Company Blog – 6 Aug 14238

Tutorial: Create Parallax effects and single-page scrollable experiences in…

Our good friends at Survey Legend have shared a great tutorial with us on creating a single-page website built for navigating by scrolling. If you’d like a quick demo on how this works, visit…

1 Like

Is there a sample of. Hype file to see or solve the fever from the file I gave it to. Thank you very much

I put it on the head section, it does not work. It does not show up in my Artboard Layout, but when I put the Code into Elements Text, it shows up in my Artboard Layout, but the code does not work. I want to put Code on Elements rather than to see Layout and Code work.

Help me thank you
Parallax Edit 1.1.zip (172.9 KB)

i think it would be good to show a working example to the forum.
i cannot imagine, what exactly you want to achieve.
your example is not working for me. what should the image do?
is there text to scroll? should i click on it?
if you want to use this:
https://www.w3schools.com/howto/howto_css_parallax.asp
you also can achieve that effect, if you use persistant symbols within hype.