jQuery Colorbox，iframe 内容在 iPad 中不滚动

在 iPad 上查看时，Colorbox iframe 内容不会滚动，请阅读以下内容：

https://github.com/jackmoore/colorbox/issues/41#issuecomment-5244379 https://github.com/jackmoore/colorbox/issues/41#issuecomment-5244379

当从 Ipad 显示大于为颜色框设置的尺寸的网页时，滚动功能将被禁用和/或不存在。

有些人可能建议用一根手指或两根手指滚动，但这不起作用。

先决条件： 拥有一台 Ipad，或前往当地百思买

重现步骤： 去http://colorpowered.com/colorbox/core/example1/index.html http://colorpowered.com/colorbox/core/example1/index.html单击外部网页 (Iframe) 链接， 在 Google 搜索中输入一些内容

结果： 您无法滚动浏览结果。

有解决办法吗？有什么东西可以解决这个问题吗？ 顺便说一句，这在 IE、Chrome 和 Firefox 上运行良好。

有人能解决这个问题吗？？？任何帮助将不胜感激。

更新 - 作者修复的问题

显然杰克有fixed https://github.com/jackmoore/colorbox/issues/41#issuecomment-13061816该问题截至今天（2013 年 2 月 4 日）。值得从他那里获取最新版本Github https://github.com/jackmoore/colorbox/ page.

以前的解决方案

好吧，我无法让 jScrollPane 正常工作。这并不是说您不会，但我还使用自定义调整大小来调整 iframe 的大小，并且我认为它与 jScrollPane 的尺寸计算配合得不好。

Solution

然而，由于更常见的 iOS iframe 滚动问题的解决方案，我确实设法让它工作，这要归功于Sharon 在 stackoverflow 上 https://stackoverflow.com/questions/5267996/how-to-properly-display-an-iframe-in-mobile-safari/5359546#5359546。我对她的代码做了一些调整，以便更好地使用 colorbox。请注意，这仅适用于您控制 iframe 内容的情况

只需将以下代码放入您的 iframe 中：

setTimeout(function () {
    var startY = 0;
    var startX = 0;
    var b = document.body;
    b.addEventListener('touchstart', function (event) {
        startY = event.targetTouches[0].screenY;
        startX = event.targetTouches[0].screenX;
    });
    b.addEventListener('touchmove', function (event) {
        event.preventDefault();
        var posy = event.targetTouches[0].screenY;
        var h = parent.document.getElementById("cboxLoadedContent");
        var sty = h.scrollTop;

        var posx = event.targetTouches[0].screenX;
        var stx = h.scrollLeft;
        h.scrollTop = sty - (posy - startY);
        h.scrollLeft = stx - (posx - startX);
        startY = posy;
        startX = posx;
    });
}, 1000);

滚动并不抖动，虽然你没有原生滚动的逐渐减慢，但当你抬起手指时它就会停止。另外，没有滚动条。除此之外，这是一个完美的解决方案。

The 莎伦解决方案页面 https://stackoverflow.com/questions/5267996/how-to-properly-display-an-iframe-in-mobile-safari/5359546#5359546提供了一种替代方案来尝试无法控制 iframe 的情况。