javascript - マウスの位置がブラウザの端に近いかどうかを判断する

Question

ブラウザで、マウスの位置を表す点が「外側の領域」と呼ばれるものにあるかどうかを判断しようとしています。たとえば、添付の画像では、外側の領域は青い背景の領域です。

コードと画像で、W はブラウザのビューポートの幅を表し、H は高さを表し、x,y はマウスの位置を表します

現在、次のコードを使用してそれを実行しています。

if (((x>0 && x<w1) || (x>w2 && x<W))
    ||
    ((x>w1 && x<w2) &&
      ((y>0 && y<h1) || (y>h2 && y<H))
    ))
    console.log("we are in the outer area")

このままでもいいのですが、何か良い方法はないでしょうか？

Answer 1

ポインターの x 位置が 0 未満または W より大きくなることはできないため、0 より大きく W より小さいかどうかを確認する必要はありません。Y 軸にも同じことが当てはまります。以下で十分です。

if((x>w2 || x<w1) || (y>h2 || y<h1)){
  console.log("We are in the outer area");
}

Answer 2

ページ全体を DIV ( と呼ばれる) にラップしてから、イベントouterに接続できます。hover