移动固定/粘性菜单CSS

时间:2018-01-05 15:00:39

标签: html css css-position

希望创建一个从网页中间开始的固定菜单,但是当使用CSS / HTML向下滚动修复到页面顶部时。

是否可以使用容器执行此操作?所以带有菜单的容器从顶部容器下方开始,当顶部容器从页面滚动时,菜单被固定在该容器的顶部和屏幕的顶部?

例如,如何在向下滚动页面时使第二个容器中的图像保持在屏幕顶部,但使其保留在第二个容器中:

https://codepen.io/Daggett/pen/mpBaab

    position: sticky;
    <!--doesn't stick!-->

有没有办法只用CSS做到这一点?我知道可以用jQuery完成

谢谢!

1 个答案:

答案 0 :(得分:1)

position: sticky需要一个明确的垂直位置,例如top:0,以了解要坚持的位置。