同位素元素 - 单击放大无法正常工作

Question

我正在尝试设置同位素（版本2）页面。

在此页面上有一个人可以点击的元素，然后放大框，画廊重绘自己。

问题在于第一次点击图库似乎没有触发布局重绘自己。

以下是我正在使用的代码：

$container.on( 'click', '.element', function() {
  // change size of item by toggling large class
  $( this ).toggleClass('large');
  $container.isotope('layout');
});

Here is a jsFiddle有一个问题的工作示例。

Here is what I am attempting to achieve

如何解决问题并使图库按预期工作？

Answer 1

事实证明我的CSS中的代码导致了问题：

.isotope, .element {
  -webkit-transition: all .4s;
  -moz-transition: all .4s;
  -o-transition: all .4s;
  transition: all .4s;
}

删除修复我的问题。我会假设过渡速度正在摆脱布局。