Question

我想我差不多了，我只需要计算隐藏儿童身高的高度并将其应用到div。

我可能需要编写一个根据孩子的身高动态变化的函数。

在演示中，单击展开/折叠图像。

点击扩展

var currentHeight = $('.Tile.is-expanded .Tile-flyout').outerHeight();

 TweenMax.fromTo(".Tile.is-expanded .Tile-flyout", 0.8, { height:0, autoAlpha:0,   ease: Linear.easeNone }, { height:currentHeight, autoAlpha:1,});
 TweenMax.fromTo(".Tile.is-expanded .Tile-flyout > *", 0.8, {height:0, ease: Linear.easeNone }, {height:"auto"});

点击折叠

var currentHeightOpen = $('.Tile .Tile-flyout').outerHeight();

  TweenMax.fromTo(".Tile .Tile-flyout", 0.8, { height:currentHeightOpen, autoAlpha:1, ease: Linear.easeNone }, {height:0, autoAlpha:0,});
  TweenMax.fromTo(".Tile .Tile-flyout > *", 0.8, { height:"auto",  ease: Linear.easeNone }, {height:0,});

DEMO here, you need to fork it

Answer 1

以下是一本代码笔，介绍了如何在我的主帖中对我解释的内容进行解释：

https://codepen.io/anon/pen/mqLREK?editors=0010

function(code){ //Ignore this, I apparently need code to link codepen
    //code code
}

你会注意到，在扩展中，我抓住了你将要扩展并使其可见的所有子元素的列表，然后我循环，并且每3个我将单元块高度添加到运行高度物品（因为我们每行3个）。

注意，如果每行可以多于或少于3个，您可能需要做一些事情来确定这一点并相应地调整循环增量

JQuery折叠/扩展需要计算高度

1 个答案: