【问题标题】:Header active class isn't being set correctly [closed]标头活动类未正确设置[关闭]
【发布时间】:2016-05-30 07:53:33
【问题描述】:

在我的website 上,当您单击导航栏链接之一时,它会转到 html 文档的正确区域,但会在导航栏上显示错误的活动类。但是,当您向下滚动一点点时,它会更改为正确的颜色/类别。

我尝试将 custom.js 第 45 行中的 -40 更改为 -9,它可以正常工作,但现在标题被稍微截断了。

我的github

【问题讨论】:

  • 您能否提供一些链接或代码来更好地解释您的问题

标签: javascript html css twitter-bootstrap


【解决方案1】:

原因在于您的网站,当您单击导航栏链接时,它并没有完全滚动到该部分,因为导航栏高度。您使用了模板,因此根据他们编写页面滚动代码的方式,考虑到导航栏的高度,他们故意将部分滚动到上方一点。为了避免这种情况

解决方案 1

1 - 转到您的 custom.js 第 45 行。

2 - 将scrollTop: target.offset().top - 40 的值增加到scrollTop: target.offset().top 或可能更多,具体取决于您。

但是,如果您这样做,显然该部分的标题将隐藏在导航栏后面。我在下面建议了另一种更清洁的解决方案。

解决方案 2

您可以简单地将margin-top: 80px; 添加到每个部分(统计信息、概述等)。

【讨论】:

  • 是的,我这样做了,但是链接太远了
  • 我提供的解决方案 2 不会滚动太远。我已直接在您的网站上进行并测试了更改,它似乎运行良好。
  • 好的,谢谢,您知道其他解决方案吗?
  • ,像这样。
  • 谢谢!有点黑客,但它会做!
猜你喜欢
  • 1970-01-01
  • 2021-07-18
  • 1970-01-01
  • 2014-07-27
  • 2020-05-15
  • 1970-01-01
  • 2023-03-31
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多