JavaScript - マウスオーバしたときに処理を呼び出す

マウスオーバしたときに処理を呼び出す: mouseenter

mouseenter イベントは、マウスのポインターが要素の中に移動したときに発生します。

/* HTML 側 */
<div id="box"></div>

/* JavaScript 側 */
const box = document.getElementById("box");

box.addEventListener("mouseenter", event => {
  console.log("マウスポインターが乗りました");
});
mouseenter イベント

マウスオーバしたときに処理を呼び出す: mouseleave

mouseleave イベントは、マウスのポインターが要素の中から離れたときに発生します。

/* HTML 側 */
<div id="box"></div>

/* JavaScript 側 */
const box = document.getElementById("box");

box.addEventListener("mouseleave", event => {
  console.log("マウスポインターが離れました");
});
mouseleave イベント