2011-06-18 10 views
3

要素の位置に基づいて要素を選択する方法はありますか?今= 100pxには、どのように私はjQueryのを使用してdiv要素を選択することができ、100pxに=左上を使用して要素の位置に基づいて要素を選択するにはどうすればよいですか?

<div id="parent"> 
    <p id="text">This is a text</p> 
</div> 

// CSS

#parent{width:100px;height:100px;position:absolute;left:100px;top:100px;} 

+0

私はjQueryの忍者ではありませんが、私はカスタムセレクタについて何かを覚えています...それが可能になる方法の1つかもしれません。 –

+2

要素の上端と左端に基づいて要素を検索しようとしていますか?言い換えれば、top = 100、left = 100のdiv要素をすべて探したいのですか – Emil

答えて

6

何かがうまくいくかもしれない:

var el = document.elementFromPoint(100, 100); 
var $el = $(el); // if you really want to use jQuery. 

ドキュメントをdocument.elementFromPointため。

これはあなたが探しているものではないかもしれません:その点に表示されている一番上の要素を取得し、その点の左上隅を持つ要素だけでなく、その領域を占める要素を取得します。しかし、チャンスは、それは助ける:)です。

It is supported by all major browsersですが、Safari 4やOpera 10.10で気に入った結果が得られるかもしれません。

+0

+1優雅な解決策 –

+0

それはクロスブラウザの互換性です – AjayR

+0

@Ajay更新;答えははいです。 – Domenic

1

すべての要素をループして位置を確認できます。ここには簡単なサンプル関数があります。

function getElementsByPosition(x,y) { 
    var elements=new Array(); 
    $('*').each(function() { 
    if($(this).css('top')==x && $(this.css('left'))==y) { 
     elements[elements.length]=this; 
    } 
    }); 
    return elements; 
} 

更新:Domenicのソリューションははるかにエレガントです。私の前に彼を考慮してください。

+0

ありがとうございました:)。しかし彼らは別のことをする...それはOPが探しているものに依存します。 – Domenic

1

jQuery css()関数を使用すると、CSSプロパティの値を取得できます。たとえば、css('left')は要素の左の位置を返します。

については、その場所に基づいてを選択してください。私はあなたが$('left=100px')のような何かを意味すると思います。これは不可能です。 jQueryは、DOMのスタイルではなく、構造を照会するCSSセレクタを使用します。このような