首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何在twitter引导中自动定位sidenav

如何在twitter引导中自动定位sidenav
EN

Stack Overflow用户
提问于 2013-01-28 13:53:27
回答 1查看 875关注 0票数 2

我一直试图使用这个问题的答案来定位sidenav。目前,我可以通过以下方式将菜单位置固定到页面上:

代码语言:javascript
运行
复制
<div style="position: fixed" ..>
  ..
</div>

或者将其添加到相应的css规则中。它工作正常,但位置开始后,巨型加速器子头,并停留在那里,当我滚动。我希望它不要覆盖页面顶部的巨型加速器,当我向下滚动时,移动到页面顶部的一个固定位置(就像在文件页中一样,除了我不关心活动高光)

我试图复制文档的源代码,并在页面中添加了docs.css文件,但由于某些原因,它无法工作。我该怎么做?

编辑

这里有一个数字来说明这一点

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2013-01-29 18:41:56

下面是一些可以让您开始的事情:http://jsfiddle.net/panchroma/s9XpJ/

我使用了词缀行为,它非常有趣,并为您提供了许多选项。

我的示例中的重要内容是我指定要监视的div的HTML中。

代码语言:javascript
运行
复制
<div "span3" id="side-nav" data-spy="affix" data-offset-top="200">
 <!-- nav here -->
</div>

并指定数据偏移顶,即在附加div之前需要滚动的距离。

当类粘贴时,它将被添加到div中,因此,在CSS中,我已经指定了发生了什么。

代码语言:javascript
运行
复制
#side-nav.affix{
top:10px;
}

您通常需要在页面上重新定位已粘贴的div,因为在默认情况下,引导将其位置定义为固定的,这会使其脱离正常流。

我还添加了一些CSS,使用媒体请求来微调视图变窄时所发生的事情。Bootstrap站点上的示例删除了用于最窄屏幕的侧导航的附加行为。我在这里重复了一遍。

祝好运!

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/14563556

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档