Fix Position of Model While Scrolling


I’m trying to keep my 3D model fixed to the background, and rotate the mesh while scrolling. Here is the code I am using:

I have a div with id 3d and I am using document.getElementById('3d').appendChild(renderer.domElement); to add the model to that div. Then I styled the 3d div with position: fixed but the div refuses to fix to the background. What am I doing wrong?

I want the sections to scroll on top of the rotating model.


Can you change the id to ‘d3d’;
CSS, HTML, and Script

That fixed it! Why doesn’t an id of ‘3d’ work?