a:hover 风格停留在 iOS 浏览器上答案

【问题标题】：a:hover style sticking on iOS browsera:hover 风格停留在 iOS 浏览器上
【发布时间】：2012-09-09 03:51:53
【问题描述】：

我最近发布了我的第一个名为 Shutter Image Gallery 的开源项目，当我查看它在移动设备 (iOS) 上的外观时，发现了一个我似乎无法解决的问题...

正如您在图片中看到的，控制按钮上的 a:hover 状态似乎保持不变。除非您单击相反的按钮，否则 a 的颜色不会返回。我试图搜索问题，但找不到任何相关内容。

代码是开源的，托管在 GitHub 上。如果你能帮忙，请这样做。在此处发布修复或将其推送到存储库。我将不胜感激。

存储库链接：https://github.com/W3Geek/Shutter

演示链接：http://w3geek.github.com/Shutter/

【问题讨论】：

这是在所有浏览器中发生还是仅在 iOS 上发生？
@DanielA.White 它在桌面浏览器上完美运行。据我所知，此错误仅在 iOS 设备上。我无法检查 Android 设备。
旁注：在显示新标题的同时仍然看到旧图片，这有点令人困惑。单击链接时，它可能应该被“加载”占位符替换。（并考虑在查看时预加载上一张/下一张图片）
@ThiefMaster 我知道，在 Shutter Image Galley 的下一次更新中，将会有预加载代码。我之前发现了它并将其添加到日志中。
这就是ios实现hover的方式。这不是错误。

标签： javascript css html oop

【解决方案1】：

尝试在 CSS 中进行媒体查询，仅在桌面上使用 a:hover 效果，而在 iOS 设备上使用 a:active 进行颜色更改。

【讨论】：

如果媒体查询可以检测到 iOS 设备，那当然很好。

【解决方案2】：

/* Desktop */
@media only screen and (min-width:650px) 
{
    a:hover 
    {
        color:red;
    }
}

/* Mobile */
@media only screen and (max-width:650px)
{
    a:active
    {
        color:red;
    }
}

【讨论】：