4

I cannot find the same issue online after over a day's searching, so I am here with tail-between-legs.

Not sure what code is relevant to this issue - can provide - otherwise see link below

I am working on a image gallery for a portfolio site. Using fancybox2, everything is working as intended on desktop version but there is a minor issue for mobile devices (testing on an iPhone 4).

Page with issue: CLICK HERE

Screenshot of issue: SCREENSHOT OF ISSUE ON MOBILE

Current Behaviour = When the user taps on the thumbnail to load up the full size image, the image loads up correctly in a pop-up window, with the 'x' to close in the corner, the user can then finger-swipe down to scroll down the page, whilst the pop-up is still open. The rest of the page is darkened whilst the image is 'open'and tapping the page elsewhere will close the image.

Desired Behaviour = When a pop-up image is open, finger scrolling the page behind image is prevented until the window is closed (by X-ing in the corner or tapping outside the popped-up image).

aside- Perhaps finger gestures should switch between images in the same gallery - although this may be too complicated (for me) to implement for now.

I am working out how to use JS as I go along, so any baby-steps advice will be recieved with gratitude.

Thank you for reading.

user3058342
  • 41
  • 1
  • 2

1 Answers1

4

I've run into that once & these are the lines that solved the problem:

   FancyboxOptions({
      scrolling   : 'hidden',
      helpers: {
         overlay: {
            locked: true 
         }
      });

I hope it's relevant to your situation :-)

Cholesterol
  • 177
  • 9