ノードが別のノードと重なっている場合は、jQueryで知ることはできますか?画面上の位置を見つけるために1つのノードが他のノードと重複しているかどうかを確認する
2
A
答えて
4
したがって、重複を検出したいですか?そして、この:
var overlaps = (function() {
function getPositions(elem) {
var pos, width, height;
pos = $(elem).position();
width = $(elem).width();
height = $(elem).height();
return [ [ pos.left, pos.left + width ], [ pos.top, pos.top + height ] ];
}
function comparePositions(p1, p2) {
var r1, r2;
r1 = p1[0] < p2[0] ? p1 : p2;
r2 = p1[0] < p2[0] ? p2 : p1;
return r1[1] > r2[0] || r1[0] === r2[0];
}
return function (a, b) {
var pos1 = getPositions(a),
pos2 = getPositions(b);
return comparePositions(pos1[0], pos2[0]) &&
comparePositions(pos1[1], pos2[1]);
};
})();
使用法:
if (overlaps(node1, node2)) {
// ...
}
0
使用.offset()
:offset();
で
をウィンドウの上部からのピクセルでその場所になりますtop
と呼ばれる座標Yを取得することができます。
var boxOne = $('#boxOne').offset():
var boxTwo = $('#boxTwo').offset():
if(boxOne.top>boxTwo.top) {
alert('boxOne is higher');
} else if (boxOne.top==boxTwo.top) {
alert('boxes are even');
} else {
alert('boxTwo is higher');
}
+1
OPは[重複](http://data.imagup.com/11/1138998080.png)を検出しようとしています。 –
0
jQueryには、あなたが探していることを実行する関数.index()があります。
あなたが機能についての具体的な質問がありましたらお気軽に: はこちらのページへのリンクです。
0
DOM内の位置については、私はindex()
で十分ではないと思います。あなたが2つの姉妹要素を比較している場合を除きます。より一般的には、
- 使用
parents()
両方のノード - 上
- 同じで
(代わりに、あなたもindex()
を行うことができ、最高異なる祖先にindex()
を比較しながら、両方の祖先リストから要素をオフにポップ$('*')
にありますが、それはひどく非効率であると思います)
EDIT:clarificatイオンは@マイクの答えの下で、これは正式に衝突検出の質問です。したがって、私はthisのようなものが順番にあると思いますが、コメントに注意してください。代わりに、jQuery offset()
functionを使用して要素の位置を取得することができます。比較ロジックは健全です。
関連する問題
- 1. ノード - ディレクトリが存在するかどうかを確認してください
- 2. iosサブビューが重複しているかどうかを確認します(ヒットテスト?)
- 3. ツリービューのどのノードがクリックされたかを確認する
- 4. xmlノードがasp.netのルートであるかどうかを確認する方法
- 5. 回しノードが他のノード
- 6. どのようにしてノード/ x/editをノード/ x/addとして1つのパネルでオーバーライドできますか?
- 7. 1つの親ノード内のすべての重複の子ノードを取得します - のXpath
- 8. vbscriptでxmlノードが空であるかどうかを確認します。
- 9. XMLの重複ノード
- 10. Xerces:重複ノードをマージするにはどうすればいいですか?
- 11. JSONのキー/ノードが存在するかどうかを確認してください
- 12. ベストプラクティス:子コンストラクタの親に子ノードを追加しているかどうかを確認しますか?
- 13. パンダは複数の行で日付が重複しているかどうかを確認します
- 14. Firebase Android - ノードが同期されているかどうかを確認する方法
- 15. ノードの1つがダウンしているときにCassandraが動作しない
- 16. Rテーブルの列に重複値が含まれているかどうかを確認しますか?
- 17. SpriteKit/Swift - 2つのノードが既に接触しているときの接触を確認する方法
- 18. 1つのDOM XMLノードを別のノードにコピーする
- 19. 2つの時間範囲が重複しているかどうかを確認するにはどうすればよいですか?
- 20. すべての親ノードに必要な子ノードがあることを確認するXPath
- 21. どのようにそれらのdivが重複していないことを確認できますか?
- 22. 子ノードが1つしかない場合、親ノードが階層でチェックされないようにするにはどうすればよいですか?
- 23. Erlang/Scala 1つのノードから別のノードへアクターを移動する
- 24. 重複したノードを示すJSTree
- 25. 同じ色のノードのパスが多色ノードのグラフの2つのノード間で見つかるかどうかを判断する最も効率的なアルゴリズム
- 26. PHP:XMLノードに属性があることを確認してください
- 27. 文書がROOTノードであることを確認してください
- 28. 複数のノードを1つのneo4j CREATE文に作成する
- 29. XPathクエリが重複するノードを返します
- 30. XMLから重複するノードを読み取る方法
DOMに関してで 'above'と' below'を定義しますか? –
David Thomasの質問の上に、どのようにノードを選択するのですか? – Jasper
「上」と「下」の3つの異なる意味に基づいて、3つの異なる答えが得られたので、間違いなく「上」と「下」を定義してください... – redShadow