• will
  • Member
  • Offline
  • Registered: 2012-12-23
  • Posts: 5

Topic: Showing too big on iPhone

Hi JB

I've embedded the a JB Pro Gallery in a regular wordpress page.  It's showing great on desktop but it's having issues in iPhone.  When I load a page without JB the page is 100% of the screen and I can pinch and zoom to navigate around the page.  When I embed JB the same page it loads only showing a small section of the page (zoomed in) and I cant pinch and zoom.

The same page fills the screen nicely on an iPad but I've noticed I'm cant pinch and zoom when JB is embedded.

I've added the splashpage never tag.

Thanks loads for any help.

Will

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

Re: Showing too big on iPhone

When I embed JB the same page it loads only showing a small section of the page (zoomed in) and I cant pinch and zoom.

Try adding the following code to the <head> section of your WordPress theme:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

Otherwise, you may like to try a mobile-friendly WordPress theme such as Twenty Twelve which may help.

and I cant pinch and zoom.

Unfortunately, it is not possible to pinch-zoom within a Juicebox gallery as the pinch-zoom gesture can interfere with the gallery controls (such as the swipe gesture to change the main image or the tap gesture for the navigation controls).

  • will
  • Member
  • Offline
  • Registered: 2012-12-23
  • Posts: 5

Re: Showing too big on iPhone

Thanks Steven!  I tried your suggestion and while it helped it still loaded pages on iPad and iPhone too big.  I tried this instead and it's all working fine -

<meta name="viewport" content="width=device-width" />

Can you see any issues using this?

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

Re: Showing too big on iPhone

No. If it works, that's great.
For more information on the 'viewport' <meta> tag, please see this web page.