Interactions Gallery problems on mobile touch devices?

I noticed that the standard PG Interactions Gallery (with popup Lightbox) doesn’t perform quite well on mobile touch devices (smartphones). On PCs and Tablets everything works fine. On my iPhone X I found several issues: It’s hard to scroll on the Gallery and almost impossible to open an image to view it in the full size.

I Imported the standard Gallery to a blank page to show the problem:

https://www.homepage-aus-leipzig.de/TestPGGallerie/

Did I missed something? Do I have to set up anything in order to make the Gallery work on Smartphones? I use PG 6.0 without any frameworks.

Hi @Riccarcharias,
I don’t have an iPhone X available to try, but your page works well on my Samsung.


Cheers,
Bob

1 Like

Interesting…it has the same problems on Chrome for iPhone. The gestures (swipe to see the next image) seem to work but not the clicks. Can anyone confirm these problems on iOS?

Hi @Riccarcharias,

Just checked your URL in Xcode Simulator IOS 14.5 iPhone 12, 11 and 10 and there is seems to swipe and scroll smoothly.

Regards,
David

1 Like

Thanks for your effort. I asked a few friends and the could also interact with the gallery without any problems. I’ll try a few things and will post updates here.

Ok, one of my friends has the same problem on his iPhone X. On iPhone 11 and 12 everything works correctly. Strange.

I was just doing a little web prowling. It seems that at least some versions of iOS handled clicks oddly. The solution was to detect if it was iOS and then simulate the second click. Not sure if there is a better solution now and not sure if it will fix your problem.

1 Like

I tried the gallery on a few friends iPhones: it works on iPhone 11, 12 and SE2. It doesn’t work on iPhone X an 8 (which are the same generation). Swipe gestures work but no touch gestures. That makes it nearly impossible to scroll on the gallery, open an image, switch between images (by clicking the arrow-button) and close the opened image.

This should effect every PG interaction gallery…

Just adding a verification - the test page on my iPhone X works with swipes - not with clicks. SOMETIMES a double-tap on the arrow icon will trigger a new slide, but not consistently.

Found this - it may help. One suggestion says that with Bootstrap you needto disable tool-tips

Not sure how to implement RobM’s hack, but it may not be that big of an issue IRL. The swipe is quite ingrained on most iPhone users.

1 Like

Thanks for your effort. I didn’t use bootstrap, just the PG interactions. So this issue should appear on any PG website using the interactions Gallery.

Hi @Riccarcharias,
Do you know if it will work if you add a touchstart trigger instead of a click trigger if it works? If so, then you could have two triggers, a click for larger screens and a touchstart for mobile. Again, I don’t have an iPhone X to test.
Sorry,
Bob

1 Like

Hello,

Yes, touchstart instead of click opens the images but makes scrolling impossible because when I tap and hold my finger on an preview image to scroll down, it immediately opens that image in the gallery…