Trying to overlay a button and text on top of a three.js scene

Hi all,

I am very new to coding and three.js. I am trying to construct a simple full page layout with some text and a button with a link on top of my three.js scene. I just want to have the scene as the background for the page.

any help would be massively appreciated!
Thanks!

Use DOM HTML. Add it in the HTML and then use CSS to add it on top of the DOM Renderer.

I.E.
HTML:
<button id="mybutton">BUTTON</button>
CSS:
button {
z-index: 265
/* Other CSS stuffs you want */
}

Then you would use javascript to overlay the events of the button into your three.js application.

Also, since your using DOM Overlay, you will need to include this script in your HTML too: http://cssreset.com/scripts/eric-meyer-reset-css/

If you have any more questions, just ask!

1 Like