Nextgen Gallery won't load in mobile safari until refreshed

@cattivodes – Do you see the same issue if you temporarily switch to a default WordPress Twenty series theme?

– Cais.

Hey Cais – I hadn’t tried that. Yes, it seems fine that way. So, therefore it is the theme.
However, I’d still like to use my current theme and your plugin – any suggestions?

@cattivodes – I didn’t see anything immediately in the page source at your site, have you tried contacting the theme author to see if they have any suggestions on what to adjust?

Thanks!

– Cais.

yes, I have a support request in with them too. Nobody can seem to figure this issue out.

Photocrati – this is their response: helpful at all?

I visited you website on iOS 8 and could indeed replicate the issue. Apparently a script is sizing photos to viewport on page load. iOS Safari is known to have such bugs. It’s probably a better idea to ask the plugin authors for a solution.

@cattivodes – Interestingly enough, I am now seeing this on your site with the current Yosemite Safari as well as the current iOS Safari … and I am not able to recreate this issue on any other site I have tested with.

Can you provide the specifics of the display you are using? Which type, any specific customizations and/or the defaults under Gallery > Gallery Settings for that type of display. Are you using any sort of custom template?

Everything looks find in Firefox and Chrome so I suspect this will just be a Safari issue at the moment but I am not certain it is only iOS due to the problem showing on the desktop. You might want to suggest your theme designer have a look at that as well … just in case.

Thanks!

– Cais.

yep – it’s not every time like it is in IOS, but I do from time to time see it on Yosemite as well.
Not using a custom template: have nothing different in the gallery settings.

only thing I’m doing differently is this:
in the actual call to show the gallery – i’m using compact album, and I’m overriding thumbnail settings so the images show full size.

@cattivodes – Have you tried re-generating your thumbnails?

Are you setting the thumbnail size on upload, or are you generating a new size with the display or in the gallery? This appears to be related to the thumbnails and their sizes but I am still not seeing anything specific pointing to why this is happening on your site in general with Safari (desktop or iOS).

– Cais.

I believe I’ve narrowed down the error to some CSS.
The problem is, without this CSS, the images wont conform to the size of the screen in mobile (like iphone) so only less than a quarter of the image shows on small screen.

with the CSS, it works right – but the problem we are discussing happens.

let me know your thoughts:

.ngg-gallery-thumbnail img {
width: 100%;
height: 100%;
}

.ngg-gallery-thumbnail img {
background-color:transparent!important;
border:none!important;
}

@cattivodes – It’s great you found a work-around for the issue you are seeing on your site, but it appears to only be happening on your site as I am not able to recreate it elsewhere.

Thanks for sharing the CSS you used, it may help with others using the same theme (which is still my first thought as to where the issue is at).

– Cais.

so, it turns out that all the problems are immediately fixed, by just upgrading to the paid version and using the Pro Blogstyle layout. It doesn’t seem quite right, that that’s the case, but it is. Apparently forcing the gallery images to show full size (by overriding thumbnail size) produces this glitch. But by showing the gallery images full size (by paying for it) it works perfectly.