Question

在点击元素时，我总是想知道:hover子句，它们似乎总是延迟，例如，一个元素将具有:hover的红色背景，但它需要大约一秒钟改变背景。

为什么这让我想知道，像Facebook m.facebook.com这样的移动网站，当点击元素时，他们似乎会在背景发生变化时立即响应（比如点击通知）。

使用:hover时，如何使此效果相同？

好的......由于没有人得到我的意思。一个典型的页面。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width = device-width; initial-scale = 1.0; maximum-scale = 1.0; minimum-scale = 1.0; user-scalable = 0;" />
<style type="text/css">

.row {
    padding: 20px;  
}

.row a:hover .row {
    background-color: red;
}

</style>
<title>Test</title>
</head>
<body>

<div class="row">
    <a href="#">Typical link</a>
</div>
<div class="row">
    <a href="#">Typical link</a>
</div>
<div class="row">
    <a href="#">Typical link</a>
</div>

</body>
</html>

如果您在iPhone上查看此内容，点击链接时，.row的背景只需一秒钟即可将背景更改为红色。

我正在使用带有iOS 4.3.3的iPhone 3GS - 当然不会影响任何东西，因为它就像iOS 3.x一样。

Answer 1

在触摸屏设备上，事件有点不同 - 没有光标，悬停是没有意义的。

如果默认行为未提供您想要的响应，则需要使用javascript根据触摸事件添加悬停/选定的类。在iOS上，touchend事件在click事件发生前几百毫秒触发，类似的事情可能适用于悬停行为。

为什么：悬停延迟？

1 个答案: