2011-11-10 25 views
14

jQuery UIドラッグ可能な対話には、親としてsetting the containmentのniceプロパティがあります。jQuery UI親の親にドラッグ可能な包含オプションを設定する方法

$(".selector").draggable({ containment: 'parent' }); 

封じ込めを親の親として設定したいと考えています。これを実現するために何の文字列値は、文字列としてのオプションが

私は計算でき

'親'、 '文書'、「ウィンドウの、[X1、Y1、X2、Y2]

ある、ありませんページの読み込み時に親の親のx1、y1、x2、y2を使用し、それらの値を使用して、ドキュメントに対するコンテナの境界を設定します。しかし、ページの読み込み後にウィンドウのサイズが変更された場合、コンテナの位置は親の親の位置に対して相対的に変更される可能性があります。ネイティブの 'parent'オプションは、ウィンドウのサイズ変更に関係なく、親要素内にdraggable要素を保持します。

親の親を使用してこのドラッグ可能な封じ込めを行う方法はありますか? 。

答えて

20

containmentオプションは、jqueryセレクタまたは実際の要素でもあります。だから、これを行うことができます。より良いまだ

$('.selector').draggable({ 
    containment: $('.selector').parent().parent() 
}); 

または:

$('.selector').each(function(){ 
    $(this).draggable({ 
     containment: $(this).parent().parent() 
    }); 
}); 
+0

私は、ソート可能なテーブルのためにこれを行うにしようとしましたが、$(この).parent()親()は動作しませんでした。その他の提案はありますか?私のtbody内の私のTRはソート可能で、私はテーブル全体にそれらを限定したいと思います。 –

3

をドキュメントによると、あなたはcontainmentプロパティの文字列にパスする必要はありません。ちょうどjQueryの(すなわち$(".selector").parent().parent())との親の親を選択し、'parent'の代わりに渡す、そう

Selector, Element, String, Array 

:あなたはのいずれかに渡すことができます。

0

これは、同様に正常に動作します:

$('.selector').draggable({ 
    containment: "#parent", 
    scroll: false 
}); 
関連する問題