When I view your gallery on an iPod Touch (whose display should be similar to that of an iPhone), the gallery is displayed in Small Screen Mode initially displaying the thumbnail page, from which a main image can be selected.

If you do not see this, then try clearing your browser's cache before reloading your web page to ensure that your browser is fetching and using the most recent gallery files from your web server.

If you would like your gallery to display a Splash Page (which, when clicked, would open the gallery on a page of its own), try embedding the gallery directly into your web page (rather than loading it into an iframe).
As you have already uploaded the complete gallery folder, you can use the baseUrl method of embedding as documented here.
Essentially, you could replace your current <iframe> code with the following embedding code:

<!--START JUICEBOX EMBED-->
<script src="/imgs/Juicebox Galleries/Water/jbcore/juicebox.js"></script>
<script>
  new juicebox({
    baseUrl : '/imgs/Juicebox Galleries/Water/',
    containerId : 'juicebox-container',
    galleryWidth : '945',
    galleryHeight : '800',
    backgroundColor: '#222222'
  });
  </script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->

For more information about Screen Modes and how Juicebox adapts to different devices and screen sizes, please see here.

I notice that your web page has several HTML errors (including several stray end </div> tags) which may be causing problems.
Try validating the code on your web page with the W3C Markup Validation Service and fix the errors that are reported.
Once the code on your web page validates correctly, the page should be rendered with greater predictability and consistency across different browsers.