php - jQuery 悬停效果 iPhone/iPod touch/iPad 不起作用

Question

我正在使用 jQuery 悬停效果创建一个网站。该网站在桌面上非常完美，将鼠标放在图像上，我有一个悬停效果，在图像上放置一个黑色层并显示框内的文本，然后单击里面的链接，我将重定向到该页面，但是当我在 ipod touch/iphone/ipad 上尝试时，它不起作用。

这是 fiddle :http://jsfiddle.net/IronFeast/RvfQg/

如何修改我的代码？我想重新创建双击框以显示里面的内容:第一次点击)选择；第二次单击)启动效果。

如有任何帮助，我们将不胜感激。

Answer 1

我喜欢你在这里使用所有 CSS 的方式。你的问题并不完全清楚，但我认为这就是你想要的:http://jsfiddle.net/howlermiller/fUSXp/2/ (在 iPad 上尝试)

使用 jQuery 获得此功能将非常简单，但由于您已经投入了一些工作来使其全部脱离 CSS，所以我将我的答案保留为所有 CSS。我用了checkbox hack ，我在 iPad 上对其进行了测试，以确保其正常工作。

此技巧也适用于桌面浏览器，因此，如果您单击该框，则样式将保留，而不是在鼠标关闭时消失。这可能是好事，也可能是坏事，具体取决于您要用它做什么。

附注使用纯 css(又名复选框 hack)并不是真正做到这一点的最佳方法。它使您的代码灵 active 和可重用性降低一些。但它确实工作得很好。

编辑:别再按了，Safari 5 中有一个错误。感谢this StackOverflow question，我找到了它。 。要修复它，您所要做的就是向标签添加一个空的 onclick(是的，是的，另一个黑客，我知道，我对此也不满意)。在我自己的测试中，Safari 6 似乎没有这个错误，所以除非您支持 Safari 5，否则您不需要它(实际上，现在这可能是一个好主意。如果您在一些情况下使用它)不过几个月，那么你可能可以使用旧 fiddle )。这是固定的jsfiddle:http://jsfiddle.net/howlermiller/fUSXp/3/