javascript - 像 theverge.com 一样缩放到顶部的浮动标题

Question

我真的很喜欢theverge.com的浮动标题。当您向下滚动时，标题保持固定在顶部，当您向下滚动到某个点时，会出现 The Verge 徽标，允许您向上放大。

如何重现类似的标头，可以仅使用 HTML 和 CSS 来完成吗？

Answer 1

用 CSS 试试这个

.fixedHeader {
    position:fixed;
    top: 0;
}

您应该使用 jQuery 构建的小按钮。因此，您必须检查属性scrollTop以了解何时应显示按钮。如果您单击按钮，您应该使用 jQuery 将 scrollTop 属性.animate()回零 (0)。

演示

这里有小按钮和点击事件：

演示