jQuery在滚动效果上更改内容

Question

您将如何实现与本网站所示相同的效果？ 当特定帖子成为两个蓝色圆形事物的焦点时，关于该帖子的数据将显示在两个圆形事物中。 是否有为此专门制作的jQuery插件？

我知道他们使用的是叠加层，我想知道更多有关特定帖子处于蓝色圆圈焦点时内容切换的信息。

谢谢

Answer 1

这很简单。 它们具有与内容同步的蓝色背景。 最重要的是，他们添加了一个覆盖层来覆盖它。 它使您感觉到圆圈在滚动时会更改其内容。 检查此叠加图像，您将得到那里发生的一切！ :)

Answer 2

如果您使用Firebug检查站点，则当查看特定帖子时，您会发现这实际上只是跨度的显示/隐藏。 一些简单的计算即可确定将每个帖子包裹在屏幕上的元素的位置。

影响：

<div class="post-wrapper">
    <span class="date"></span>
    <div class="post"></div>
    <span class="type"></span>
</div>

计算post-wrapper的位置

如果它在某个位置，请在前一个post-wrapper隐藏<span> ，并显示当前post-wrapper的<span> 。

当然还有一些漂亮的CSS定位。