这篇文章主要为大家展示了“HTML和css如何检测鼠标双击”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“HTML和css如何检测鼠标双击”这篇文章吧。

检测鼠标双击

HTML:

<div class="test3">
<span><input type="text" value=" " readonly="true" />
<a href="http://renpingjun.com">Double click me</a></span>
</div>

CSS:

.test3 span {
 position: relative;
}
.test3 span a {
 position: relative;
 z-index: 2;
}
.test3 span a:hover, .test3 span a:active {
 z-index: 4;
}
.test3 span input {
 background: transparent;
 border: 0;
 cursor: pointer;
 position: absolute;
 top: -1px;
 left: 0;
 width: 101%; /* Hacky */
 height: 301%; /* Hacky */
 z-index: 3;
}
.test3 span input:focus {
 background: transparent;
 border: 0;
 z-index: 1;
}