Put each script block next to the associated board div

This commit is contained in:
Aaron Fenyes 2024-10-21 16:31:15 -07:00
parent 7a79ed1de0
commit 883e660e7c
6 changed files with 106 additions and 84 deletions

View file

@ -10,6 +10,8 @@
<h1>Sphere sampler</h1>
<!-- creating spheres -->
<h2>Creating spheres</h2>
<p>
Right now, there are two ways to create a <a href="https://jsxgraph.org/docs/symbols/Sphere3D.html#constructor"><code>Sphere3D</code></a>:
@ -21,11 +23,6 @@
</p>
<div id="creating-spheres-board" class="jxgbox" style="width:600px; height:600px"></div>
<h2>Styling spheres</h2>
<p>Here are some styling options for spheres and the points that define them.</p>
<div id="styling-spheres-board" class="jxgbox" style="width:600px; height:600px"></div>
<!-- creating spheres -->
<script type="text/javascript">
// to prevent variable name conflicts, we define variables locally using `let`
// and put the code for each board in its own block
@ -93,7 +90,12 @@
}
</script>
<!-- styling demo -->
<!-- styling spheres -->
<h2>Styling spheres</h2>
<p>Here are some styling options for spheres and the points that define them.</p>
<div id="styling-spheres-board" class="jxgbox" style="width:600px; height:600px"></div>
<script type="text/javascript">
// to prevent variable name conflicts, we define variables locally using `let`
// and put the code for each board in its own block
@ -223,5 +225,6 @@
);
}
</script>
</body>
</html>