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

Question

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

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

Answer 1

默认的 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>

...