• Registered: 2014-12-24
  • Posts: 2

Topic: iOS 8 non-responsive

Hi,

I created a gallery for drupal and a responsive theme. I tried the site on an Android Phone and on an iPhone with iOS 7 and there the site with the gallery is displayed correctly. I tried the site on three iPhones with iOS 8 and there the site with the gallery is non-responsive, so you see the normal desktop version on the mobile phone. Is this a bug with iOS 8 or can I fix this issue by myself?

Thanks for your helb and I wish you merry X-Mas

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

Re: iOS 8 non-responsive

I tried the site on three iPhones with iOS 8 and there the site with the gallery is non-responsive, so you see the normal desktop version on the mobile phone.

First of all, please ensure that you are using the most recent version of Juicebox-Lite (v1.4.2) to ensure that any bugs which were present in previous versions but which have since been fixed are not contributing to your problem.
If necessary, you can download the current version of Juicebox-Lite from the download page here.

If your gallery sets screenMode="AUTO" (the default value for this configuration option), then your gallery should be displayed in Small Screen Mode on small screen devices (like the iPhone). (Please see here for more information on how Juicebox adapts to different devices and screen sizes.)
Do you see the problem in both Chrome and Mobile Safari on your iPhones or just in one of these browsers?
Are you able to upload screenshots somewhere of what you are seeing on iOS 7 vs iOS 8 so that I can see what you are seeing? (For example, I do not know if your gallery uses a Splash Page and whether or not this is displayed.)
Also, it may help if I could see the gallery in question so please post the URL to your gallery's web page so that I can investigate further. Thank you.

3 Reply by bergaa (edited by bergaa 2014-12-28 17:22:20)

  • Registered: 2014-12-24
  • Posts: 2

Re: iOS 8 non-responsive

First of all, please ensure that you are using the most recent version of Juicebox-Lite (v1.4.2)

Yes I use the latest version of the library.

If your gallery sets screenMode="AUTO" (the default value for this configuration option), then your gallery should be displayed in Small Screen Mode on small screen devices

screenMode is a pro-Version setting, right? So I use the lite Version and can't set this setting.

Do you see the problem in both Chrome and Mobile Safari on your iPhones or just in one of these browsers?

It looks like the problem exists only in Chrome. I didn't tried it before in Safari but it looks like it works correctly in Safari. The false display is also in Chrome on iOS 7 so the problem lies not in the iOS version.

Are you able to upload screenshots somewhere

Here are two links for the site displayed wrong in Chrome:
www.scr1965.de/sites/default/files/temp/chrome1.PNG
www.scr1965.de/sites/default/files/temp/chrome2.PNG

Here are two links for the site displayed correctly in Safari:
www.scr1965.de/sites/default/files/temp/safari1.PNG
www.scr1965.de/sites/default/files/temp/safari2.PNG

Also, it may help if I could see the gallery in question so please post the URL to your gallery's web page

The link for a gallery which shows the worng display format is http://scr1965.de/erfolgreicher_abend_fuer_den_scr.

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

Re: iOS 8 non-responsive

It looks like your problem may be due to a CSS conflict between some custom CSS code on your web page and the CSS code of the Juicebox gallery itself. Your web page may use some global CSS rules (which apply to all images on your web page including those in your Juicebox gallery) that the gallery has no option but to inherit. Unfortunately, it is not possible to isolate a Juicebox gallery (or any other element) on a web page to prevent it from inheriting global CSS rules.

Please check your CSS to see if you have any rules which are applied to all img tags within your web page's content section (which is where your Juicebox gallery is). It looks like you may have CSS rules which affect image attributes such as borders, margins/padding and possibly maximum-width.

Your web page loads 18 external CSS files so it might take a short while to search through them all but your browser's developer tools, usually accessible by pressing F12, should help. If you find any such rules, then please apply them to only those elements on your web page which require them through use of CSS selectors (ids and classes).