Detect double click with css

This has me a bit puzzled but I like the trick. As seen on Css-tricks.com, you can use css to activate a link on a double click

<span class="dblclick-wrap">
  <a class="dblclick" href="http://google.com">Double click me</a>
  <span></span>
 </span>

.dblclick-wrap {
	position: relative; /* For absolute positioning within */
}

.dblclick {
	position: relative; /* So z-index works later, but no surprises now */
	/* background: blue; Uncomment to test coverage */
}

.dblclick + span {
	position: absolute;
	top: -1px;
	left: -1px;
	width: 103%; /* Gotta do this instead of right: 0; */
	bottom: -1px;
	z-index: 1;
	/* background: red; Uncomment background property to test coverage */
}

.dblclick + span:active {
	left: -9999px; 
}

.dblclick:hover {
	z-index: 2;
}

The post Detect double click with css appeared first on Coding Insight.