は、私は以下のように「クリック」機能によって制御される動的な高さを持っているいくつかのdivを持つ動的な高さのjQuery Wookmark

Question

を実装することはできませんそれらの高さがセクションの1つを拡大することによって動的にサイズ変更されてから。文書からは、あなたがこの作業hereを見ることができます私は自分のコードに例の1つにコピーされ、ダイナミックな高さが

 $(document).ready(new function() { 
      // Prepare layout options. 
      var options = { 
      autoResize: true, // This will auto-update the layout when the browser window is resized. 
      container: $('#container'), // Optional, used for some extra CSS styling 
      offset: 30, // Optional, the distance between grid items 
      itemWidth: 300 // Optional, the width of a grid item 
      }; 

      // Get a reference to your grid items. 
      var handler = $('.outerwrapper'); 

      // Call the layout function. 
      handler.wookmark(options); 

      // Capture clicks on grid items. 
      handler.click(function(){ 
      // Randomize the height of the clicked item. 
      var newHeight = $('img', this).height() + Math.round(Math.random()*300+30); 
      $(this).css('height', newHeight+'px'); 

      // Update the layout. 
      handler.wookmark(); 
      }); 
     }); 

に動作します。 div内の見出しの1つをクリックすると、例のようにレイアウトが更新されるようにするにはどうすればよいですか。前もって感謝します。

Answer 1

通常、サードパーティ製のjQueryプラグインには、何らかの種類の「更新」機能や「サイズ変更」機能が含まれています。

機能をすばやく見れば、その機能は表示されません。

JAVASCRIPT：

$("h1.resize").live("click", function() 
{ 
    $(window).trigger('resize'); 
}); 

（ブラウザのサイズ変更にレイアウトをリロードします）「自動サイズ変更」オプションがあるのでしかし、あなたは、単にそのような「サイズを変更」イベントをトリガクリックイベントを作成することができます

​​

http://api.jquery.com/resize/

---

EDIT： もう一度質問を再読み込み、 このようになります。 handler.wookmark（）;

（投稿したコードに基づいて）レイアウトを更新する必要があります。だからあなたは、サイズ変更トリガーの代わりにそれを使用することができるはずです。

$("h1.resize").live("click", function() 
{ 
    handler.wookmark(); 
});