Colorbox has a strange behavior when pinch to zoom-in on Ipad

Question

I'm a newbie in this amazing world and I'm doing my first project: a webapp with HTML5, Jquery and Colorbox to show modal windows on Ipad devices.

After a weeks trying to understand how they can work all together, finally I have finished my webapp.. All is working fine except a behavior that I couldn't to solve and I hope you can help me.

When I open my modal windows and I do a pinch to zoom in an image showed on Colorbox window, the overlay background blinks or is "redrawed" (or it seems to me) and the modal window is repositioning instead to maintain the original position (viewport centered).

I have set the fixed=true and the window seems that maintain the original position (not ever) but the "blinking" effect continues..

Could you help me, please? I'm very desperated.

Thanks in advance Alex

Answer 1

About repositiong, there's an option called 'reposition'. If you set that to false only on "pinch-zoomable" devices (I'm using modernizr to detect that, using the touch and no-touch classes) the colorbox won't run away when you zoom the device. :)

$(".example").colorbox({reposition: false});