jQuery能在iPhone的Safari浏览器上工作吗?

6

我正在制作一个网站,在其中使用了类似于lightbox的jquery slimbox2插件来生成照片放大效果。

这个插件在我尝试过的每个浏览器中都能正常工作,除了iPhone上的Safari。它在Windows上的Safari上可以正常使用,但是在iPhone上有两个问题:

  • 页面其余部分的变暗只发生在页面顶部,大约是视口的高度(假设页面顶部400像素),下面的所有内容都保持不变。
  • 更大的图像本身位于页面的正中央,而不是视口的正中央。

我在某个地方读到过jquery应该在iPhone上完美工作,但由于定位和淡入淡出似乎是基本的jquery功能,所以我想这可能并不完全正确。当然,也可能是插件的问题...

因此,我的问题是:jquery是否真的在iPhone上工作,如果没有,有人知道如何使其工作吗?

非常感谢!

3个回答

5

jQuery在iPhone上运行良好。Mobile Safari与桌面版一样,都是基于标准的浏览器。实际上,在某些CSS规则采用方面更好。只要JavaScript符合iPhone的UI差异(例如没有mouseover),任何类型的JavaScript都可以正常运行。

我认为问题最好改为“Slimbox2是否适用于Mobile Safari?”


这也是一种可能性,我也联系了开发者。不过,我认为你的问题对于SO来说可能有点太具体了。 - jeroen

5

我知道这篇文章已经超过一年半的时间了,但是为了帮助其他人,我还是写下了以下内容:

我的猜测是,你的插件可能使用position:fixed来创建叠加层(你提到的“页面变暗”)和更大图片本身的容器。在移动Safari上搜索position:fixed会给你很多进一步的阅读材料!

似乎因为移动Safari认为“视口”是整个页面而不仅仅是可见部分,所以position:fixed通常不能按照我们期望的方式工作。我正在使用另一个jQuery插件遇到相同的问题,它为我创建了一个“模态”窗口,症状与你描述的非常相似。

我目前正在尝试通过(A)排除position:fixed并更改为position:absolute,同时(B)基于body的整个高度和窗口的“scrollTop”jquery属性手动设置高度和“top”。我认为一些老式的浏览器嗅探可能会有所帮助,因为这个“hack”目前只在这个浏览器中真正需要。


谢谢!覆盖层确实具有position:fixed,这意味着它不是jQuery而是移动Safari的CSS处理。我没有想到过这一点! - jeroen

3

据早期播客中的Jeff所说,Stack Overflow在iPhone上可以正常使用,并且Stack Overflow使用jQuery,因此jQuery也能在iPhone上使用。

这可能是Safari浏览器的一个bug。您可以在苹果设备上尝试一下,看看是否也能正常工作。


谢谢。我的一个朋友用苹果电脑确认它在他的电脑上可以正常工作。 - jeroen

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接