Topic: Problem with embedded gallery in Safari, chrome, Opera

My page
    - some explanations
    - a film
    - an embedded gallery

http://michel.balmont.free.fr/photo/cam … efort.html

works perfectly on
    - Firefox (mac os x 6 & Windows 7)
    - Safari 5 (mac os x 6)
    - Google Chrome (mac os x 6)

Not on (the text and film appear and disappear very quickly, stays only the gallery)
    - latest Safari (mac os x 10)
    - Google Chrome (mac os x 10)
    - Opera (mac os x 10)
    - Internet explorer (Windows 7)

I didn't test further.

What's the problem and what can I do ?

Thank you.

Michel

Re: Problem with embedded gallery in Safari, chrome, Opera

Your gallery appears to be functioning as expected (and similarly) in all browsers I have viewed it in on my PC (Chrome 42, Firefox 38.0.1, Internet Explorer 11, Opera 29).
The image overlay (including the image captions) is displayed when the user hovers over the gallery with the mouse and the overlay disappears after 4 seconds of inactivity (the default value for inactivityTimeout).
If you are seeing different behavior in different browsers, then try clearing each browser's cache before reloading your web page to be sure that your all your browsers are fetching and using the most recent versions of your gallery files.

If you were using Juicebox-Pro and wanted to disable the timeout feature, you could set inactivityTimeout (in JuiceboxBuilder-Pro's 'Customize -> Main Image' section) to '0' (zero).
You could also set showImageOverlay (Pro only) to AUTO, ALWAYS or NEVER (also in the 'Customize -> Main Image' section). The default value (used by Juicebox-Lite) is AUTO.

3 (edited by Michel 2015-05-20 09:08:43)

Re: Problem with embedded gallery in Safari, chrome, Opera

Thank you for your concern.

But in fact the problem doesn't concern the overlay but the text that must appear before the gallery in the page, quite a few lines, with a short movie extract in the middle.

Michel

Re: Problem with embedded gallery in Safari, chrome, Opera

Thank you for clarifying. I did not see this problem when I viewed your web page in the browsers I noted above.
The text and video above your gallery displayed fine and did not disappear.
Including a Juicebox gallery on your web page should not affect any other elements on your web page. All CSS code introduced by Juicebox uses selectors which apply only to the gallery itself. Global rules are not used.

Did you try clearing your browser caches to see if this made a difference?
Unfortunately, without being able to see or replicate the problem for myself, it is difficult to troubleshoot or to know what might be causing your problem.

I notice that you now provide a link to your gallery (rather than embedding it directly in your web page) but if you can, please create a new test page which you can still see the problem in and post its URL so that I can take another look and hopefully help further. Thank you.

5 (edited by Michel 2015-05-20 18:45:16)

Re: Problem with embedded gallery in Safari, chrome, Opera

I did it in

http://michel.balmont.free.fr/photo/cam … edded.html

Thank you again.

Michel

Re: Problem with embedded gallery in Safari, chrome, Opera

Thank you for creating a new test page.

I have just checked this page in Chrome 42, Firefox 38.0.1, Internet Explorer 11, Opera 29 and Safari 5.1.7 on my PC and the text and video (and gallery) all display fine and stay visible in all browsers.

The only potential problem I see is that you have given your gallery a percentage height (100%) and your gallery does not have a parent container which has been assigned a height via CSS. Therefore, the browser may not be able to determine what the gallery's actual height should be 100% of. (Maybe the browser is using 100% of the entire viewport and covering the other elements on your web page with the gallery.)
Please also see this note regarding Using Percentage Heights.
Try giving your gallery a fixed pixel height (perhaps 600px) instead to see if this helps.

Re: Problem with embedded gallery in Safari, chrome, Opera

I can see what you mean... you have text above the gallery but it wont allow you to scroll up the page to see it, it just shows the gallery.

Perhaps put the gallery in a different DIV

<div id="gallery">

You should also enable scrolling on the web page...

Re: Problem with embedded gallery in Safari, chrome, Opera

... it just shows the gallery.

This is what makes me think that the 100% height is the root of the problem.

Perhaps put the gallery in a different DIV

This should not make a difference. There are no duplicate ids on the page and the gallery is already correctly embedded into a div with a unique id.

You should also enable scrolling on the web page...

Unless otherwise specified, vertical scrolling should already be enabled on the page as the default value for the CSS overflow property is visible.