我正在努力清理锚点的工作方式.我有一个固定在页面的顶部的头,所以当你在页面的其他地方链接到一个锚,页面跳转所以其锚固在页面的顶部,留下固定头后面的内容(我希望那讲得通).我需要一种方法来将锚点从头部的高度偏移25px.我更喜欢HTML或CSS,但Javascript也可以接受.
我正在使用Twitter Bootstrap构建一个站点,并在页面顶部有一个40px固定位置导航栏.我设置了一些锚点以跳转到整个页面中的各种H1,但锚点目标最终被导航栏部分遮挡.有没有办法将链接偏移到导航栏的帐户?我已经看到一个建议将每个锚放在它自己的偏移div中,但这似乎是很多重复的代码,我想知道是否还有另一种方法.
如果可能的话,我宁愿用CSS而不是jQuery来做这件事,但任何解决方案都是受欢迎的.
.topbar {
height: 40px;
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 10000;
overflow: visible;
}
body {
padding-top: 40px;
/* 40px to make the container go all the way to the bottom of the topbar */
font-family: 'Proxima', "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
line-height: 18px;
font-weight: normal;
color: #555;
background-color: #eee;
}
Run Code Online (Sandbox Code Playgroud)
谢谢!
我目前正在使用这个插件:http://github.com/davist11/jQuery-One-Page-Nav
但更愿意转而使用Twitter的Bootstrap.js Scrollspy:http://twitter.github.com/bootstrap/javascript.html#scrollspy
但是,这不提供在单击时为滚动动画设置动画的选项.我该如何添加?