如何创建固定元素

Question

正如您在图片中看到的，如何修改菜单标签？

我尝试将div定位属性更改为fixed，但问题是它会覆盖在我的图片上。实际上，当点击tab1时，菜单部分会进入屏幕。

我想修改菜单部分，点击菜单内容即菜单1,2,3 ，右侧内容部分应该更改。

我已在此处上传了我的文件：link。

Answer 1

使用

position: fixed
bottom: 54px; //Change to what you want
width: 100%; //Change to what you want

Answer 2

对不起我以前的回答，你有两个解决方案：

使用CSS：

您可以手动将margin-bottom设置为.navigator部分，以便内容完全在此部分下，但这不是一个好的解决方案，除非此部分不会随时更改高度< / em>的

使用jQuery：

您可以使用以下内容将height值提供给.navigator

$(".navigator").css({ height: $(".size").height() });

Answer 3

这很简单。当您position:fixed从文档流中删除元素时，这就是它位于图像顶部的原因。

你也需要定位它，例如

.your-element{
position:fixed;
top:0; /* Positions top of your div to top of browser window*/
left:0; /*positions left of your div to left of the browser window*/
}

以上代码将始终为您提供窗口左上角的固定菜单。您可以利用边距将其准确地放在您想要的位置。