與抽屜同位素

我卡住了，真的需要幫助！我有一個磚佈局，我正在使用jquery同位素進行佈局。有三種磚尺寸：正方形，雙寬和雙正方形，所以它們完美地適合於地方。我需要做的是當你點擊一個磚塊時，在磚塊下方打開一個抽屜，然後將所有磚塊向下推到最低處，以便抽屜的高度。這裏有一個實體模型來解釋什麼，我試圖做的：與抽屜同位素

Bricks with Drawer http://bdub.ca/bricks_drawer.jpg

在這個例子中被點擊的橙色磚和抽屜在下一個換行符，這是紅磚後打開。抽屜將始終是模型中的半寬。

任何想法？我很茫然，所以任何建議都將非常感謝！

來源

2013-02-25 briteweb

你能把你到目前爲止的小提琴放在一起嗎？看看會更容易一些。 – dev 2013-02-25 20:54:54

橙色和紅色磚以任何方式相關？如果沒有，那麼我不知道你對下面的內容有任何控制。您可以插入，但僅限左側或右側。同位素將確定它需要包裝 – 2013-02-25 20:58:44

我唯一的想法是擴大橙色磚的高度和寬度，並調用'relowout' - http://isotope.metafizzy.co/docs/methods.html#relayout – 2013-02-25 21:04:16

由Jason Sperske提出了一個解決方案：

http://jsfiddle.net/thomasNDS/5fNe9/2/

這個例子擴大塊的大小上點擊重新佈局等。

  $items.click(function(){ // $items regroup all item display 
      var $this = $(this); 
      // nothing to change if this already has large class 
      if ($this.hasClass('large')) { 
       $this.removeClass('large'); 
      }else{ 
       var $previousLargeItem = $items.filter('.large'); 
       $previousLargeItem.removeClass('large'); 
       $this.addClass('large'); 
      } 
      $container.isotope('reLayout'); 
      });

您可以使用3個不同大小的塊，將此代碼調整爲您的示例。

來源

2013-09-17 14:31:00 Thomas

與抽屜同位素

回答

相關問題