Bootstrap scrollspy仅在第二次单击时获得高度偏移 [英] Bootstrap scrollspy only gets height offset on second click

问题描述

我制作了一个带有Bootstrap 3.2.1的页面，并在此页面中使用了scrollspy.在第一次单击菜单中，滚动页面的偏移高度无效，但是在第二次单击后，偏移高度无效.

此代码可在浏览器中使用！但是当第一次单击标题2(或标题3或标题4)时，页面应在标题2(或标题3或标题4)上滚动.

offsetHeight value = 120;

参见实时演示

请参阅jsfiddle演示

解决方案

那是因为您将导航栏设置为向下滚动固定(在y> 90之后).因此，在导航栏固定后，您需要折扣.

您需要一个基于代码的动态值，一种实现方法是使用具有相同参数的函数.导航栏的高度为30像素，因此您需要添加它.

function offsetHeight() {
  if ($(window).scrollTop() > 90) {
    return 120;
  }
  else {
    return 150;
  }
}; 

JSFiddle

I've made a page with bootstrap 3.2.1 and use scrollspy in this page. In the first click on menu doesn't work offset height for scroll page, But after the second click works offset height.

This code work in browsers! but when click title 2 (or title 3 or title 4) for first time the page should be scroll on Title 2 (or Title 3 or Title 4).

offsetHeight value = 120;

see Live demo

see jsfiddle demo

解决方案

That because you set the navbar to fixed on scroll down (after y > 90). So you need to discount the height of the navbar when it's fixed.

You need a dynamic value, based on your code, a way to do this is using a function with the same parameters. The height of the navbar is 30px so you need to add it.

function offsetHeight() {
  if ($(window).scrollTop() > 90) {
    return 120;
  }
  else {
    return 150;
  }
}; 

JSFiddle

这篇关于Bootstrap scrollspy仅在第二次单击时获得高度偏移的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！