Question

我有一个带有jQuery的网页。当我在iPad / iPhone上打开它时，超链接在为其设置悬停行为时无法按预期工作。

我试图通过浏览互联网上的许多网站来解决这个问题但却找不到任何特定的解决方案。也许我无法理解发生了什么。我会很感激一些线索和解决方案。

以下是设置悬停的代码：

.box:hover .box_details .description2 {
  height: auto !important;
  display: block
}

.box .social {
  width: 150px ;
  position: absolute;
  z-index: 99 ;
  margin: 0 auto;
  margin-left: 50%;
  left: -75px;
  text-align: center
}

.box:hover .social ul {
  margin-top: 10px;
  -webkit-transition: margin-top linear 0.5s ;
  transition: margin-top linear 0.5s ;
}

.box .social ul {
  width: 100% ;
  float: left ;
  margin-top: -50px ;
}

.box .social ul li {
  float: left;
  list-style: none;
  margin: 1% 1% 0 1%;
  line-height: 20px;
  width: 22%
}

.box .social ul li img {
  width: 100% !important;
  position: relative
}

请帮帮我。谢谢！

Answer 1

如果你在谈论桌面和移动的jQuery事件

$('.selector').on('mouseenter touchstart', function(){ 
     // Do something
});

$('.selector').on('mouseleave touchend', function(){
     // Dhing someto
});

Answer 2

我认为你可以改变悬停事件来触摸事件。

Answer 3

在iOS中，所有悬停事件都被视为点击事件。因此，如果您在链接上有一个：悬停样式，则用户必须单击该链接两次。这篇文章讨论了iOS：hover / double tap issue。

Answer 4

任何移动网站（在Iphone或Ipad或任何设备中使用） 悬停效果是不必要的 （由于触摸），它将无效。< / p>

最好只使用:active伪造的类别。

使用jQuery在iOS上的点击/悬停行为混淆

4 个答案: