Question

过去几天我一直在使用Bootstrap，在使用Opera时似乎遇到了一个错误。在页面加载时，导航栏应该有一个如下所示的列表：

<li class="hidden active">
<li class="page-scroll">
<li class="page-scroll">
<li class="page-scroll">
<li class="page-scroll">

当用户滚动到新页面（或点击li）时，相应的li会变为:active，并且会相应地更改颜色等。这适用于我使用的所有浏览器（IE，Chrome，Firefox，Android Chrome和Safari）。然而，遗憾的是，在Opera上，列表呈现如下：

<li class="hidden">
<li class="page-scroll">
<li class="page-scroll">
<li class="page-scroll">
<li class="page-scroll active">

此外，当点击li（或页面的某个部分滚动到）时，它不会将其类更新为:active，上面的列表是静态的（因为缺少更好的词） - 它永远不会改变！

有人知道导致这种情况发生的错误吗？或任何可能的解决方案？

提前致谢！

Answer 1

用于页面的jQuery（以及滚动功能）是bootstrap scrollSpy。我的CSS将body和html都设置为height: 100%。使用Opera时，scrollHeight和maxScroll无法正确计算！这意味着导航栏无法正确更新。我无法告诉你为什么会出现这个错误以及为什么它只出现在Opera中。

然后解决方案是从height: 100%删除body - 然后它会完美运行（除非现在出现问题）。

还有其他解决方案吗？

Answer 2

其他解决方案是：

在bootstrap.js中替换此行

scrollHeight = this.$scrollElement[0].scrollHeight || this.$body[0].scrollHeight

这一行：

scrollHeight = $(document).height()

Bootstrap：主动li Opera bug

2 个答案: