Inner html seems to be only loaded for the smallest screen size

1

Hello,

I’m trying to insert this functionality into an animation: http://sam.haslers.info/render-sphere/JavaScript+Canvas.html

To do this I’ve added a rectangle with inner html, but this is only loading on the smallest screen size.
The final implementation can be found here: http://dev-newmoonsmoke.pantheonsite.io/fr

Any help would be greatly appriciated.

Kind regards,

Laurent

2

You need to post the document. We will then be able to see what you are doing rather than just the end result!!.

3

Hi, Sorry I’m new here.

Here’s the document: NewMoonWorking.zip (600.9 KB)

1 Like
4

I wasn’t able to get this specifically working for any scene, but undoubtedly the cause is that each scene uses the same IDs for the canvas and div elements. IDs need to be unique for your document, so you might be able to get it working via calling them “sphere1”, “sphere2”, “sphere3”, etc. Otherwise the code that creates the sphere is only going to find the first one, repeatedly. (Scenes stay on the DOM, but hidden, when they are not being displayed).