我目前正在使用同位素来帮助我调整一组盒子的大小和重新布局。当它调整其中一个 div 的大小时,我想用隐藏的 div 替换内容。
这里有一些代码给出一个想法:
$('#container-2').isotope({
childSelector: '.child-big',
masonry: {
columnWidth: 468
};
});
$('.child-big').click(function() {
var $this = $(this);
if ($this.hasClass('tall')) {
tileStyle = {
width: 468,
height: 150
};
}
else {
tileStyle = {
width: 468,
height: 190
};
}
$this.toggleClass('tall');
$this.find('.child-content').stop().animate(tileStyle);
$('#container-2').isotope('reLayout')
});
如果有帮助,还有更多代码:http: //jsfiddle.net/Mx6KH/4/
我不知道如何让它切换。在这个项目的早期版本中,我一直在使用 jQueryUI 的 addClass 和 removeClass 函数,但我不确定这是否仍然适合这种设置,或者是否有更简单的方法来完成它;这变得有点笨拙。