jQueruyで「クリックした場所が、真ん中より ”右上・右下・左下・左上” を判定する方法」はありますか？ 考えているのは、 バルーンメニューを開くボタンがあるけど、
jQueruyで「クリックした場所が、真ん中より ”右上・右下・左下・左上” を判定する方法」はありますか？ 考えているのは、 バルーンメニューを開くボタンがあるけど、 それが画面のどこにあるかわからなくて、 もし ”右上” にあるボタンなら、 そのボタンの ”左下” にメニューのバルーン出したい という感じで、つまりボタンの点対称の位置にバルーンメニューを表示したいということです。もしボタンが右下なら、ボタンの左上にメニューのバルーンを出したいですし、ボタンが左上なら、ボタンの右下に出したいです。 こういった仕組みはどういう書き方になるでしょうか？
JavaScript・33閲覧・100
ベストアンサー
「バルーンメニュー」っていう単語については、 どんなモノを指すのか皆目見当もつかないんで分からんけど、 「画面」というのが、 ウィンドウのクライアント領域のことを言っているのであれば、 クリックした位置は下記のようなコードで判別できる。 ──────────────── window.addEventListener( "click", evt => { // クリックした位置座標 const x = evt.pageX - pageXOffset; const y = evt.pageY - pageYOffset; // 中心座標 const centerX = innerWidth/2; const centerY = innerHeight/2; // クリック位置判定 const area = ( x<centerX && y<centerY ) ? "左上" : ( x<centerX && y>=centerY ) ? "左下" : ( x>centerX && y<centerY ) ? "右上" : "右下" ; // 判定結果をアラート表示 alert( area ); }, false ); ────────────────
1人がナイス！しています
質問者からのお礼コメント
ありがとうございました。
お礼日時：1/15 1:15
