jQueryダイアログボックスの同位体問題

Question

私の問題を説明するのは少し難しいですが、私は画像を使用してみます。

デモ：http://jsfiddle.net/H8Qbn/13/

私は自動的に同位体を使用してjQueryのダイアログをアレンジしてみてください。

• 最初の画像は、すべて正常に動作していることを示しています。

次の写真は、第一jQueryのダイアログのサイズを変更しようとしたときに何が起こっているのかを示しています。それはちょうど良いサイズ変更され、他のすべてのダイアログが自動的に配置されます。次いで

• Iが第二のダイアログ（左上）の位置に従って、それは最初の移動を配置しようとすると、サイズ変更および他のすべてのダイアログが自動的に配置されていません。

• 第三のダイアログは、それが（左上）の位置を記載して自動的に配置されていない移動2と全く同様に動作します。

任意の提案ですか？

Answer 1

ドラッグ可能なダイアログボックスではアイソトープが作成されていません。このタイプの機能に関してはwhat the plugin author saysを参照してください。

EDITFiddled around with a few more things。ダイアログが.remove（）で閉じられると、レイアウトが再配置されます。ただし、ドラッグはサポートされていません（上記を参照）。また、手動でサイズ変更することもできません。ダイアログボックスを手動でサイズ変更する必要があるのはなぜですか？プログラムで行うことはできませんか？

Answer 2

jquery masonryプラグインは、ダイアログボックスのサイズ変更やアイテムの追加や削除を行った後に、周囲のコンテナのmasonry（ "reload"）関数を使用して新しい位置を計算することができます。周囲のコンテナに画像を追加したり削除したりするときに、JavaScriptで使用しました。私のホームページには、ウェブアドレスhttp://www.chihoang.deでライブのMasonryプラグインが動作しています。

はこれが最後に私の先頭に追加し、追加石材（ "リロード"）との関数である。

  if (ele.Additem == "Append") { 
      container.append($j("#brickTemplate").tmpl(ele).css({ 
      "display": "block" 
      })).masonry('reload'); 
     } else if (ele.Additem == "Prepend") { 
      container.prepend($j("#brickTemplate").tmpl(ele).css({ 
      "display": "block" 
      })).masonry('reload'); 
     } 

そして、これは私のremove関数である：

 $j('.brick').remove(":contains('" + ele.Headline + "')"); 
     container.masonry('reload');