CSSでマウスカーソルを見えなくする方法

プレゼンとか展示やるのにWebブラウザでやってて、マウスカーソルが画面に表示されてるとうざいよね

簡単に消せた

body {
  cursor: none;
}

これだとaタグの:hoverとか勝てないことがあるので、
完全抹消したいときは!important

* {
  cursor: none !important;
}

しかし見失うのでjsでマウスが動いているときは表示、止まったら消すみたいにしたほうが良い

var timer;
window.addEventListener('mousemove', function() {
  document.body.classList.remove("hideCursor");
  clearTimeout(timer);
  timer = setTimeout(function() {
    document.body.classList.add("hideCursor");
  }, 1000);
});

雑だけどこんな感じでいけるはず