html - ios safari 奇怪的双击/悬停行为
<p><p>我最近对我的网站进行了(响应式)重新设计。</p>
<p>奇怪的是，每个测试人员都错过了某些地方的链接的奇怪行为(因为他们认为他们错过了我想象的链接):</p>
<p>如果您点击这些链接，它们只会被“激活”——但不会被关注。如果您再次单击它们，它们就会正常工作。</p>
<p>如果您连续点击 7 个链接，然后再次点击第一个链接，这甚至可以工作。</p>
<p>这只发生在 ios 8.x 上(在 8.4.1 上测试。)但不会发生在 7.x 上，也不会发生在 android 或任何桌面浏览器上。</p>
<p>通过远程调试，我什么也看不到。</p>
<p>我什至不知道从哪里开始调试这个......</p>
<p>可以在此处查看效果(使用 8.x iPhone):<a href="http://www.plamundo.de" rel="noreferrer noopener nofollow">http://www.plamundo.de</a>在列出的产品中。</p></p>
<br><hr><h1><strong>Best Answer-推荐答案</ strong></h1><br>
<p><p>我看到了相同的行为，但仅适用于 8.4.1 而不是 8.4。您的网站上似乎也是如此。 8.4.1 设备需要双击，而 8.4 则只需单击一次。这是我构建的最小测试用例:</p>
<pre><code><html>
<head>
<title>Minimal testcase iOS 8.4.1 hover double tap problem</title>
<style>
body { font-size: 2em; } /* Only needed for a readable font-size */
a { display: block; font-decoration: none;}
a:hover { font-decoration: underline; }
</style>
</head>
<body>
<a href="http://www.apple.com/" >Click me</a>
</body>
</html>
</code></pre>
<p>我们通过设置 'a:hover' 条件来解决这个问题。您可以使用媒体查询(但如果您还想以 iPad 为目标，这很难)或使用一些添加类的 JavaScript 来完成此操作，您可以使用该类来使 CSS 具有选择性。示例:</p>
<pre><code>if (!("ontouchstart" in document.documentElement)) {
document.documentElement.className += " no-touch";
}
</code></pre>
<p>与:</p>
<pre><code>.iamanobnoxiousiphonedevice *:hover{
text-decoration: inherit !important;
}
</code></pre>
<p>解决此问题的更简单方法是删除“显示: block ”，但我不知道这是否适合您。</p></p>
<p style="font-size: 20px;">关于html - ios safari 奇怪的双击/悬停行为，我们在Stack Overflow上找到一个类似的问题：
<a href="https://stackoverflow.com/questions/32146197/" rel="noreferrer noopener nofollow" style="color: red;">
https://stackoverflow.com/questions/32146197/
</a>
</p>
页:
[1]