Question

我正在使用bootstrap。我正在尝试在我的页面上创建ScrollSpy Bootstrap，但它不起作用。无论我做什么，它都无法正常工作，我不明白为什么？有人可以看看我的代码，并告诉我有什么问题。这是：

    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

    <link rel="stylesheet" type="text/css" href="css/style.css">

    <style>
    #top-center-photo{
        width: 100%;
        height: 500px;
        background-color: red;
    }

    #aboutus-content{
        width: 100%;
        height: 500px;
        background-color: green;
    }

    #offert{
        width: 100%;
        height: 500px;
        background-color: yellow;
    }
    </style>

</head>
<body  data-spy="scroll"  data-target=".navbar">
  <nav class="navbar navbar-inverse navbar-fixed-top">
    <div class="collapse navbar-collapse" id="myNavbar">
        <ul class="nav navbar-nav">
            <li><a href="#top-center-photo">o nas</a></li>
            <li><a href="#aboutus-content">oferta</a></li>
            <li><a href="#offert">realizacje</a></li>
        </ul>
    </div>
 </nav>
<div id="top-center-photo">
</div>

<div id="aboutus-content">
</div>

<div id="offert">
</div>

<div id="realizacje">
</div>

Answer 1

唯一的问题是你没有正确链接js文件

将此代码放在</body>标记

上方

<!-- Latest compiled and minified JavaScript --><script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>

这是你的滚动间谍：Demo正常工作

您的代码中没有错误......工作正常：）

bootstrap scrollspy不起作用

1 个答案: