使用固定导航发布滚动条
issue scrollto using fixed nav
我使用scrollto和scrollspy建立了一个单页网站。一旦导航条固定在顶部,页面就会很好地工作。但是如果你在导航栏固定到顶部之前点击任何链接,所有链接都会关闭。它们的高度没有一致性。我对偏移量进行了调整,我为每个部分设置了100px的内边距,以解决间距问题。
这是一个链接到开发网站…http://23.23.170.24/aspire/
这是js…
文档$()时()函数{
$(window).scroll(function(){
var window_top = $(window).scrollTop() +1; // the "12" should equal the margin-top value for nav.stick
var div_top = $('#checkdiv').offset().top;
if (window_top > div_top) {
$('nav.navbar').addClass('navbar-fixed-top');
$('section').addClass('scrolled');
} else {
$('nav.navbar').removeClass('navbar-fixed-top');
$('section').removeClass('scrolled');
}
});
$(".click").click(function(evn){
evn.preventDefault();
$('html,body').stop(true).scrollTo((this.hash, this.hash),1000, {axis: 'y', offset :0});
return false;
});
$('body').scrollspy({ target: '#navbar' })
});
当标题卡住时,Bootstrap scrollspy
和scrollto
会自动考虑标题的高度。当打开时,你所要做的就是减去标题的高度,然后你就会滚动到页面上正确的位置。
相关文章:
- CSS-若窗口太小,滚动条会出现在“表格”单元格上
- 禁用(而不是隐藏)浏览器滚动条
- 在firefox和chrome中的左侧显示iframe滚动条
- jquery:将动画绑定到滚动条位置的更好方法
- 在窗口中添加滚动条
- 如何查明鼠标按下事件是否发生在滚动条上或元素中的其他任何位置
- 使用没有插件的javascript自定义滚动条
- CodeMirror.禁用垂直滚动条
- 使用 CSS 在导航栏上创建“不可见”滚动条(隐藏不起作用)
- 导航栏未显示在滚动条上
- 具有垂直滚动条的水平滚动条页面导航
- CSS 时间轴滚动条禁用导航
- 有人制作了一个长文档的平滑滚动条/导航栏吗
- 将固定的导航条停靠在滚动条的顶部
- 如何使导航条固定在滚动条的顶部
- 如何使滚动折叠导航导航条固定顶部
- 长导航条引入水平滚动条
- JS/jQuery -设置侧导航条的滚动条到特定位置
- 如何使导航栏显示在滚动条上
- 使用固定导航发布滚动条