• Registered: 2016-09-12
  • Posts: 1

Topic: Display issue on android and iOS devices

Hi,

I have this page, using the pro version: http://nanotannteknikk.no/galleri.html

Shows fine on windows, but not on iOS or android devices. Best way to explain is to check it out on these devices.

Any tip on what i'm missing or help to solve this problem is higly appreciated :)

Regards
Geir Ove

  • Registered: 2012-04-24
  • Posts: 5,924

Re: Display issue on android and iOS devices

When you first view your gallery on a mobile device, what you are seeing is the Splash Page.

The Splash Page is a placeholder for the gallery which is displayed by default on small screen devices when the gallery is embedded in a page alongside other content (rather than displayed on a page of its own with dimensions of 100% x 100%, filling the browser window) and may may too small to be usable.
When the user clicks or taps the Splash Page, the gallery is expanded to fill the user's browser window (giving the images more space to be displayed).
For more information about the Splash Page and how Juicebox adapts to different devices and screen sizes, please see here.

You can choose to not use the Splash Page by setting showSplashPage="NEVER" (in JuiceboxBuilder-Pro's 'Customize -> Splash Page' section).
Alternatively, you can force the gallery to be displayed in Large Screen Mode (which, by default, does not use the Splash Page) on all devices and in all browsers by setting screenMode="LARGE" ('Customize -> General').

If you choose to continue to use the Splash Page, you can customize it using the Splash Page configuration options.

By default, the Splash Page uses the first image in the gallery and the image is resized to fill the Splash Page (cropping may occur).
As the Splash Page image can be though of as representing the gallery as a whole, you could create and use an image specifically for the Splash Page (it does not need to be used in the gallery itself). You can set an image for the Splash Page using the splashImageUrl configuration option.
As your gallery is responsive (its size will depend on the size of the user's browser window) and the Splash Page image is cropped to fill the gallery area, you might like to choose an image which would work well when dynamically cropped to different sizes.