Skip to content

Instantly share code, notes, and snippets.

@jonathanlurie
Last active March 21, 2017 17:28
Show Gist options
  • Save jonathanlurie/f7261e717fc94063b4992fcecb71ba69 to your computer and use it in GitHub Desktop.
Save jonathanlurie/f7261e717fc94063b4992fcecb71ba69 to your computer and use it in GitHub Desktop.
Hides the cursor after 2 seconds, then show again when moving. https://bl.ocks.org/jonathanlurie/f7261e717fc94063b4992fcecb71ba69
<html>
<head>
</head>
<body>
Hides the cursor after 2 seconds, then show again when moving.
<script>
(function() {
// after how many millisec do we want to hide the cursor
var intervalMs = 2000;
function hideCursor(){
document.body.style.cursor = "none";
}
function showCursor(){
document.body.style.cursor = "default";
}
var lastMousePosition = {x:0, y:0};
var mousePosition = {x:0, y:0};
var lastTime = 0;
window.onmousemove = function(e) {
lastMousePosition.x = e.clientX;
lastMousePosition.y = e.clientY;
lastTime = performance.now();
showCursor();
}
window.setInterval(function(){
if(lastMousePosition.x == mousePosition.x &&
lastMousePosition.y == mousePosition.y &&
(performance.now() - lastTime) >= intervalMs )
{
hideCursor();
}else{
lastMousePosition.x = mousePosition.x;
lastMousePosition.y = mousePosition.y;
}
}, 100);
})();
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment