javascript - 像fancybox这样的弹出插件可以在触摸设备上使用吗？

Question

我需要一个可以包含 iframe 的弹出插件（如 fancybox），并且在桌面浏览器和 ipad、android 和 iphone 等触摸浏览器中都能很好地工作。当我捏住触摸浏览器时，Fancybox 的行为很奇怪。我真正需要它做的是：

1. 包含一个 iframe
2. 当我放大触摸浏览器时，我仍然可以左右滚动首页，而不会到处乱跳。它的行为应该与页面中的任何其他元素一样。
3. 我应该可以说它应该是（例如）800 像素宽和 90% 的视口高度
4. 如果视口大小发生变化，它应该最好重排
5. 如果它后面的页面滚动，它应该保持在页面的中心。

Answer 1

jQueryUI 对话框怎么样？

根据我的经验，它在移动设备上表现良好，并且支持 iframe 作为对话内容。

Answer 2

默认的 Fancybox2 内置了一些对触摸的支持。如果您查看源代码，您将看到isTouch在整个代码和默认设置中使用的变量。默认设置autoCenter的默认值为!isTouch，因此在移动浏览器上它不会居中，因为它没有得到很好的支持。我建议您测试这些默认值：

    <script>
        $(document).ready(function() {
            $('#selector').fancybox({
                modal: false
                ,type: 'iframe'
                ,minWidth: 960
                ,height: '90%'
                ,closeClick: false
                ,padding: 0
                ,scrolling: 'no'
                ,autoSize      : false
                ,helpers: {
                    overlay :{
                        closeClick:false
                        ,speedOut:0
                        ,showEarly:true
                    }
                }
            });
        });
    </script>

...