0

我有一个简单的页面，里面有滚动间谍。滚动时效果很好，但是当我单击导航面板中的链接时，前一个链接会突出显示（尽管页面滚动正确）。此外，当我从第一个 div 中删除 class="navbar" 时，滚动也开始出现一些故障（突出显示触发时间不正确）。HTML 如下：

<!DOCTYPE html>
<html>
<head>
    <!--<script src="http://code.angularjs.org/1.0.7/angular.js"></script>-->
    <script src="./jquery-1.9.1.js"></script>
    <script src="./bootstrap.js"></script>
    <link rel="stylesheet" href="./bootstrap.css" />
</head>
<body>
    <div id="navbarExample" class="navbar">
        <ul class="nav">
            <li><a href="#abc">abc</a></li>
            <li><a href="#def">def</a></li>
            <li><a href="#ghi">ghi</a></li>
        </ul>
    </div>
    <div data-target="#navbarExample" data-spy="scroll" style="width: 200px; height: 120px; overflow-y: scroll">
        <h4 id="abc">abc</h4>
        <div>a b c d e f g h i j k l m n o p q r s t u v w x y z 1 2 3 4 5 6 7 8 9 0 a b c d e f g h i j k l m n o p q r s t u v w x y z 1 2 3 4 5 6 7 8 9 0 a b c d e f g h i j k l m n o p q r s t u v w x y z 1 2 3 4 5 6 7 8 9 0</div>
        <h4 id="def">def</h4>
        <div>a b c d e f g h i j k l m n o p q r s t u v w x y z 1 2 3 4 5 6 7 8 9 0 a b c d e f g h i j k l m n o p q r s t u v w x y z 1 2 3 4 5 6 7 8 9 0 a b c d e f g h i j k l m n o p q r s t u v w x y z 1 2 3 4 5 6 7 8 9 0</div>
        <h4 id="ghi">ghi</h4>
        <div>a b c d e f g h i j k l m n o p q r s t u v w x y z 1 2 3 4 5 6 7 8 9 0 a b c d e f g h i j k l m n o p q r s t u v w x y z 1 2 3 4 5 6 7 8 9 0 a b c d e f g h i j k l m n o p q r s t u v w x y z 1 2 3 4 5 6 7 8 9 0</div>
    </div>
</body>
</html>

有解决办法吗？

4

1 回答 1

0

我也有这样的问题，将您的数据属性移动到正文中，它会起作用。

<!DOCTYPE html>
<html>
<head>
    <!--<script src="http://code.angularjs.org/1.0.7/angular.js"></script>-->
    <script src="./jquery-1.9.1.js"></script>
    <script src="./bootstrap.js"></script>
    <link rel="stylesheet" href="./bootstrap.css" />
</head>
<body data-target="#navbarExample" data-spy="scroll">
    <div id="navbarExample" class="navbar">
        <ul class="nav">
            <li><a href="#abc">abc</a></li>
            <li><a href="#def">def</a></li>
            <li><a href="#ghi">ghi</a></li>
        </ul>
    </div>
    <div style="width: 200px; height: 120px; overflow-y: scroll">
        <h4 id="abc">abc</h4>
        <div>a b c d e f g h i j k l m n o p q r s t u v w x y z 1 2 3 4 5 6 7 8 9 0 a b c d e f g h i j k l m n o p q r s t u v w x y z 1 2 3 4 5 6 7 8 9 0 a b c d e f g h i j k l m n o p q r s t u v w x y z 1 2 3 4 5 6 7 8 9 0</div>
        <h4 id="def">def</h4>
        <div>a b c d e f g h i j k l m n o p q r s t u v w x y z 1 2 3 4 5 6 7 8 9 0 a b c d e f g h i j k l m n o p q r s t u v w x y z 1 2 3 4 5 6 7 8 9 0 a b c d e f g h i j k l m n o p q r s t u v w x y z 1 2 3 4 5 6 7 8 9 0</div>
        <h4 id="ghi">ghi</h4>
        <div>a b c d e f g h i j k l m n o p q r s t u v w x y z 1 2 3 4 5 6 7 8 9 0 a b c d e f g h i j k l m n o p q r s t u v w x y z 1 2 3 4 5 6 7 8 9 0 a b c d e f g h i j k l m n o p q r s t u v w x y z 1 2 3 4 5 6 7 8 9 0</div>
    </div>
</body>
</html>
于 2013-07-26T13:14:06.823 回答