Ios 悬停一个DIV影响另一个DIV：为什么在便携式设备上点击两次？

在我实现了hover-one-DIV（影响另一个内部DIV）之后，我注意到iPad/iphone上出现了奇怪的错误行为。现在，只需轻触两下即可使用悬停代码单击DIV中的链接：

HTML:

第一次点击仅在悬停操作时执行带有类的子div。portfblock_imgdiv_txt_dsc_over根据悬停的需要变得可见，并且只有第二次点击执行href链接跳转

我的整个页面都在关注iPad/iPhone的不当行为

JSFIDLE上有HTML和CSS代码片段以及要检查的部分之一：

它可以用鼠标在电脑上正常工作，但只需在触摸屏上轻触两下就可以找到网站缩略图中的链接

可能有人也面临同样的影响吗？在触摸屏设备上用鼠标悬停点击div时，是否可以省略鼠标悬停动作，并在第一次点击后立即跳转链接href

谢谢你的帮助

---

@bubencode

这是hover在移动设备上的工作方式。由于如果没有光标，则不存在悬停的概念，因此可以选择在第一次点击时触发悬停，然后单击第二次。原因很可能是在显示下拉菜单或类似菜单时，使用鼠标悬停不会破坏站点

---

如果悬停在触控设备上是毫无意义的，请考虑检测并移除它，使你的网站响应。

不确定这是否是答案，但是在HREF内嵌套div不是一个好主意。这是一个块级标记，可能导致这种奇怪的行为。将div上的类向上移动到href标记，然后删除div@MattLambert：谢谢，我听说这是一种不好的款式。但你能澄清一下如何避免这种情况吗？将div上的类向上移动到href标记，然后删除div是什么意思？谢谢。@SleekGeek：我尽量说得具体一些，把所有的代码片段都放在了JSFiddle上。我还应该做什么？谢谢。什么不应该显示在悬停上，什么应该显示？将类添加到href标记，或者将div环绕在href标记上，而不是在其内部。是的，他完全正确，移动设备上没有悬停状态

<div class="portfblock">
    <div id="portfblock1_imgdiv"> <a href="http://photoRadosti.com" target="_blank"> 
                <div class="portfblock_imgdiv_txt_dsc_over">Baby &amp; Family Photography</div> 
              </a>
    </div>
    <!-- #portfblock1_imgdiv -->
    <div id="portfblock_desc"> <a href="http://photoRadosti.com" target="_blank">photoRadosti.com</a>

    </div>
</div>
<!-- #portfblock -->

.portfblock:hover .portfblock_imgdiv_txt_dsc_over {
    visibility: visible; 
}