マウスのカーソルを、タイマーを設定して、操作していないとしばらくすると消えて、マウスを動かすと再び表⽰されるようにする(p5.js)

Set a timer for the mouse cursor so that it disappears after a while if you do not operate it, and reappears when you move the mouse.

マウスカーソル、完全に隠すと不便だし、常に出てると作品の邪魔になってしまう。マウスを動かさないで暫く経つと消え、動かすと現れるように設定します。

let timer;
let hideTime = 3000; // カーソルを隠すまでの時間(ミリ秒)

// 初期状態でカーソルを表示&タイマーをリセット
function setup() {
  createCanvas(800,800)
  cursor(); 
  resetTimer(); 
}

// マウスが動いたらカーソルを表示&タイマーをリセット
function mouseMoved() {
  cursor();
  resetTimer();
}

// 既存のタイマーをクリア&新しいタイマーを設定
function resetTimer() {
  clearTimeout(timer); 
  timer = setTimeout(hideCursor, hideTime); 
}

// カーソルを非表示
function hideCursor() {
  noCursor(); 
}

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA