iPhone上的Fancybox问题 [英] Fancybox problem on iPhone

问题描述

Fancy box似乎在iPhone和iPad上工作时出现问题。

Fancy box seems to have problems working on iPhone and iPad.

去这里 http://fancybox.net/blog 并点击iPhone或ipad页面上的5.显示登录表单立即尝试。表单不是中心，当您尝试输入详细信息时，框会在页面上移动并使其无法使用。

Go here http://fancybox.net/blog and click "5. Display login form Try now" on the page in an iPhone or ipad. The form is not center and when you try to enter your details the box moves about the page and makes it unusable.

任何修复？

谢谢，
C

Thanks, C

推荐答案

Fancybox尝试每次自动调整大小并居中浏览器窗口已调整大小，此事件在iPad和iPhone上会被触发很多。对于花式框1.3.4，控制它的代码是第608行：

Fancybox attempts to auto resize and center itself everytime that the browser window is resized, and this event gets triggered a lot on iPads and iPhones. For fancy box 1.3.4, the code which controls this is line 608:

$(window).bind("resize.fb", $fancybox.resize);

为了解决这个问题，我修改了fancybox JS的这一部分，并添加了另一个名为resizeOnWindowResize的选项，你可以为iPad和iPhone用户设置为假，或者只是一起禁用所有。

To fix the issue, I modified this part of the fancybox JS, and added another option called "resizeOnWindowResize", which you can set to false for iPad and iPhone users, or just disable all together.

if(currentOpts.resizeOnWindowResize) {
   $(window).bind("resize.fb", $fancybox.resize);    
}

您还必须在$ .fn.fancybox中为此选项添加默认值.defaults哈希地图。

You must also add a default value for this option in $.fn.fancybox.defaults hash map.

然后，当调用fancybox时，您可以使用这个新选项：

Then, when calling fancybox you can utilize this new option:

$('#fancybox_link').fancybox(${'scrolling': 'no',
                              width: 'auto',
                              height: 'auto',
                              centerOnScroll: false,
                              resizeOnWindowResize : false});

这篇关于iPhone上的Fancybox问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！