Hi Steven. I have tried the above fix and I am still getting the error locally and live. Also, when I open the index.html file for this it says the same thing. I am using Firefox v76. I have tried on other browsers with the same thing happening. I have a photogallery directory on the root and then a quebeccity directory in that and that is where all the files, images etc. are. I have placed the below code in the page where I want this gallery to appear. Here is my code:

<!--START JUICEBOX EMBED-->
<script src="photogallery/quebeccity/jbcore/juicebox.js"></script>
<script>
new juicebox({
containerId: "juicebox-container",
galleryWidth: "800",
galleryHeight: "400",
backgroundColor: "rgba(255,255,255,1)"
});
</script>
<div id="juicebox-container">
<!-- Image gallery content for non-javascript devices -->
<noscript>
<h1></h1>
<p></p>
<p><img src="photogallery/quebeccity/images/quebeccity1.jpg" title="quebeccity1" alt="" /><br>quebeccity1 </p>
<p><img src="photogallery/quebeccity/images/quebeccity2.jpg" title="quebeccity2" alt="" /><br>quebeccity2 </p>
<p><img src="photogallery/quebeccity/images/quebeccity3.jpg" title="quebeccity3" alt="" /><br>quebeccity3 </p>
<p><img src="photogallery/quebeccity/images/quebeccity4.jpg" title="quebeccity4" alt="" /><br>quebeccity4 </p>
<p><img src="photogallery/quebeccity/images/quebeccity5.jpg" title="quebeccity5" alt="" /><br>quebeccity5 </p>
<p><img src="photogallery/quebeccity/images/quebeccity6.jpg" title="quebeccity6" alt="" /><br>quebeccity6 </p>
<p><img src="photogallery/quebeccity/images/quebeccity7.jpg" title="quebeccity7" alt="" /><br>quebeccity7 </p>
<p><img src="photogallery/quebeccity/images/quebeccity8.jpg" title="quebeccity8" alt="" /><br>quebeccity8 </p>
<p><img src="photogallery/quebeccity/images/quebeccity9.jpg" title="quebeccity9" alt="" /><br>quebeccity9 </p>
<p><img src="photogallery/quebeccity/images/quebeccity10.jpg" title="quebeccity10" alt="" /><br>quebeccity10 </p>
<p><img src="photogallery/quebeccity/images/quebeccity11.jpg" title="quebeccity11" alt="" /><br>quebeccity11 </p>
<p><img src="photogallery/quebeccity/images/quebeccity12.jpg" title="quebeccity12" alt="" /><br>quebeccity12 </p>
<p><img src="photogallery/quebeccity/images/quebeccity13.jpg" title="quebeccity13" alt="" /><br>quebeccity13 </p>
<p><img src="photogallery/quebeccity/images/quebeccity14.jpg" title="quebeccity14" alt="" /><br>quebeccity14 </p>
<p><img src="photogallery/quebeccity/images/quebeccity15.jpg" title="quebeccity15" alt="" /><br>quebeccity15 </p>
<p><img src="photogallery/quebeccity/images/quebeccity16.jpg" title="quebeccity16" alt="" /><br>quebeccity16 </p>
</noscript>
</div>
<!--END JUICEBOX EMBED-->

I can't for the life of me figure this out and if it does not work then I need to get a refund. Please help, it's driving me crazy!!