可以将2个粘性元素叠加在一起吗？或者使用其中一个作为背景？
TLDR;我能够使用一个库（StickyKit）来完成这项工作，该库可以完成我正在寻找的工作，但是在执行新的异步滚动时表现不佳。
JSFiddle with StickyKit - https://jsfiddle.net/cibulka/4nd3b0tt/ - （这就是我所描述的，但表现不佳，见下文）
我是如何做到的：我在200%包装中包含了粘性元素，并将floated包裹在left中。然后我将其中一个（margin-left: -100%）移到另一个上面。这样他们就彼此重叠，但仍保持高度。
position:sticky {strong}很多怪癖中的一个是position:sticky，如果它的任何父项是overflow:hidden，它就不起作用。有关详细信息，请参阅此答案：Why does `overflow:hidden` prevent `position:sticky` from working?
我需要做的是让2个元素以某种方式覆盖，不用他们的容器为overflow:hidden。或者我应该完全做其他事情吗？
目前，我已经放弃了“200％容器”并将我的图片容器（.sticky.bg，请参见小提琴）设置为height:0。这使得图像“卡住”，但是一旦用户滚动到底部，它们就不再变得“相对”。
这显然不太理想。
很长一段时间我是StickyKit的快乐用户。不幸的是，它与asynchronous scrolling不能很好地协作，越来越多的浏览器使用它来提高性能。例如，使用新的Firefox Quantum（57），StickyKit几乎无法使用。
我在StickyKit Github中创建了一个问题，但作者似乎放弃了包裹：https://github.com/leafo/sticky-kit/issues/252
因此，我不得不弃用StickyKit并转移到原生position:sticky（与StickyFill一起填充）。不幸的是，position:sticky无法做到这一点，这就是其中之一。
我在position:sticky：Position sticky: scrollable, when longer than viewport
建议，基本上，如何解决这个问题。我正在使用不同的JS / jQuery库，编写我自己的代码或使用一些古怪的CSS hack来破解position:sticky功能。
提前致谢！