Css 粘性紧致元素堆栈的角度指令

我正在寻找一个好的angular指令，它将处理粘性元素，并在它们离开视图时向其附加一个紧凑的类

因此，想象一下网站上的一个标题元素，其正常高度为200px；。。。但是当你开始向下滚动时，你首先会使加热器变粘（位置固定-顶部：0），但是当你向下滚动超过200像素（我猜）时，你会在它上面附加一个“compact”类，所以你会在顶部看到一个压缩的标题版本，比如说70px；。这是现代[响应性]网站的既定行为

这很好，也很容易。问题是当您想在顶部堆叠更多元素时

为了更好地解释我自己。。。你会有提到的标题和提到的行为。。。但再往下看，你会看到一张桌子，在最下面一行。。。你想把它叠在上面，但是在标题之后。。。而且只有当你滚动通过它的时候…而且还具有“紧凑”的行为（但不一定）

想象一下，你会有一些向下的导航（例如选项卡）。。。你想把它们也贴在上面，但只能贴在页眉和表格之后

因此，指令需要根据已经固定在那里的元素计算固定顶部位置，以及它们是否是自身的紧凑版本

另外，它还应该考虑（CSS）动画位（假设你将在元素的高度上放置一个过渡动画……所以完整到紧凑的转换是平滑的）

已经有类似的东西了吗？我认为就预期行为而言，这并不是什么新鲜事……所以肯定已经有了一些解决方案

有人吗？

需要一点修改

它有一个body sticky类，因此您可以在元素变为粘滞后更改整个页面的行为

UPD1 正如我之前所说的，对ngSticky进行一点更新就可以了

所以我决定做这样的改变 这是我的叉子

这仍然是非常在制品，我计划将其贡献给主要的ngSticky项目完成后。 但在此之前（并继续我的工作），我想和你确认一下这是否是你所期望的行为

---

任何回答都会有帮助。

我知道这是一个老话题，但我认为我有一个合适的解决方案

我是的创建者，并且已经实现了此功能

您可以查看演示显示的大部分内容。“collections”演示有更多类似于标题的行为

---

不过，要实现压缩，还需要一些智能CSS，但我认为使用插件当前的功能应该是可能的。无论如何，我可能也需要对此进行研究，因为我可以想象这可能是一个受欢迎的请求。

我尝试了粘性，但它只处理第一部分。。。对于一堆粘性元素（以及更改为堆栈中先前元素的偏移量）来说，这并没有真正的帮助，特别是对于先前元素成为紧凑版本（因此偏移量更小）的部分，我认为正在朝着正确的方向移动。。。在我看来，compact上的逻辑应该更加动态，而不是基于静态偏移量——特别是在一个响应站点上。。。我已经在一个内部解决方案上工作了好几天了，有一堆粘性元素，包括表头。。。。我实现的逻辑是首先应用compact类，获得元素的新高度，然后删除compact类。。。所以你有一个更动态的偏移量。。。。这不是最优雅的，但有一个技巧…现在工作表头也被卡住了，并且保留了列宽。。。。当你向下滚动并传递表格时，移除粘性…@DS\u web\u developer你可以使用

confine

来移除部分。这对我很有用。动态补偿计划，但正如我所说，这是一个早期演示（3-4小时的工作）。感谢反馈，sticky不会更新Resize上元素的宽度。对我来说，使用“Angular sticky”的主要障碍是，它只在主体滚动时起作用。信息技术