40 lines
867 B
HTML
40 lines
867 B
HTML
<!doctype html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<link rel="stylesheet" href="style.css">
|
|
<script src="hoverIntent.js"></script>
|
|
<script src="https://en.js.cx/test/libs.js"></script>
|
|
<script src="test.js"></script>
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<div id="elem" class="clock">
|
|
<span class="hours">12</span> :
|
|
<span class="minutes">30</span> :
|
|
<span class="seconds">00</span>
|
|
</div>
|
|
|
|
<div id="tooltip" hidden>Tooltip</div>
|
|
|
|
<script>
|
|
// for the demo
|
|
setTimeout(function() {
|
|
new HoverIntent({
|
|
elem,
|
|
over() {
|
|
tooltip.style.left = elem.getBoundingClientRect().left + 5 + 'px';
|
|
tooltip.style.top = elem.getBoundingClientRect().bottom + 5 + 'px';
|
|
tooltip.hidden = false;
|
|
},
|
|
out() {
|
|
tooltip.hidden = true;
|
|
}
|
|
});
|
|
}, 2000);
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|