javascriptでマウスポインターを消したい

Question

###前提・実現したいこと
WebExtensionsでマウスポインターを数秒後に消すアドオンを作っています。
mousemoveだと最初にマウスを一回動かさないとマウスポインターが消えないので動かさずに消す方法を教えてください。
それからリンクなどの選択状態のときにマウスポインターが消えないので消すにはどうしたいいでしょうか。
###該当のソースコード

function onGot(item) {
  let time = 5000;
  if (item.time) {
    time = item.time;
  }
  var timer;
  const idlebreak = function() {
    document.body.style.cursor = 'auto';
    clearTimeout(timer);
    timer = setTimeout(function() {
      document.body.style.cursor = 'none';
    }, time);
  };
  document.documentElement.addEventListener('mousemove', idlebreak);
}
const gettingItem = browser.storage.local.get('time');
gettingItem.then(onGot);

###補足情報(言語/FW/ツール等のバージョンなど)
Firefox Developer Edition53.0a2

Answer 1

これはあなたが書いたソースじゃないんですかにゃ？
mousemoveのイベントリスナーを消せばマウスを動かさなくても消える様になりますにゃ。

function onGot(item) {
  let time = 5000;
  if (item && item.time) {
    time = item.time;
  }
  var timer;
  clearTimeout(timer);
  timer = setTimeout(function() {
    document.body.style.cursor = 'none';
  }, time);
}

カーソルを消す範囲をaタグなどにも広めるなら、
CSSを使う方が手っ取り早いと思いますにゃ。

.hideCursor,
.hideCursor * {
    cursor: none;
    pointer-events: none; //マウスのイベントを無視する
}

styleを指定していたところを適当なclassName追加に変更する：

function onGot(item) {
  let time = 5000;
  if (item && item.time) {
    time = item.time;
  }
  var timer;
  clearTimeout(timer);
  timer = setTimeout(function() {
    document.body.classList.add('hideCursor');
  }, time);
}

カーソル戻すときは追加したclassNameを削除する：

document.body.classList.remove('hideCursor');

Comments

[nekojiro]

説明不足でしたごめんなさい