0

我正在尝试做一个不错的导航栏,就像您在 Bootstrap 的“入门”页面上看到的那样。

到目前为止,很多工作都在工作,除了将活动状态应用于好元素的滚动间谍。

我不知道为什么它不起作用,我确实<body>按照其他问题中的建议修复了 Height:100% 。

这是我的 HTML:

<!doctype html>
<html lang="fr">
<head>
    <meta charset="utf-8" />
    <link href="css/bootstrap.css" rel="stylesheet">
    <script src="jquery-1.11.1.min.js"></script>
    <script src="js/bootstrap.js"></script>
    <script type="text/javascript">
    $('body').scrollspy({
        target: '.bs-docs-sidebar',
        offset: 40
        });
    </script>

    <title>Manuel Utilisateur </title>
</head>
<body>

<div class="barrehaut">
    <div class="container"> 
    <div class="row text-center" >
        <div class="col-md-4 col-lg-4">
        <img src="images/LogoEpicture.png" alt="logo epicture" > 
        </div>
        <div class="col-md-4 col-lg-4"  >
        <h1>Manuel Utilisateur</h1>
        </div>
        <div class="col-md-4 col-lg-4" >
         <img src="images/logo.jpg" alt="logo">
        </div>
    </div>
    </div>
</div>

<div class="Centre container"> 
    <div class="row">  
        <div class="col-xs-9">
        <h2 id="1">Environnement requis pour accéder au système</h2>
        <h3 id="1.1">Préambule</h3>
    <p>Les acteurs du chantier se connectent au service via Internet  avec un ordinateur raccordé au réseau de l'entreprise ou équipé d'une connexion internet propre.
    Les documents consultés sur le serveur peuvent sur demande être transférés sur l'ordinateur.
    </p>
    <div class="centrage"><img src="images/Archi2.jpg" /></div>
    <h3 id="1.2">Connexion via Internet</h3>
    <p>Pour travailler dans de bonnes conditions, il est conseillé de s'équiper d'un ordinateur disposant d'une configuration minimum décrite ci-après.</p>
    <h3 id="1.2">Configuration Minimale</h3>
    <p><em>Ecran : </em>Affichage 800 par 600 pixels minimum</br>
    <em>Système d'Exploitation : </em>Windows 98 ou supérieur/Mac OS X 10.0 ou supérieur </br>
    <em>Logiciel de navigation (Browser) : </em>
    <ul>
        <li>Internet Explorer 8.0 et supérieurs</li>
        <li>Mozilla Firefox version 1.0 et supérieurs</li>
    </ul> 
    <em>Logiciels bureautiques :</em>
    <ul>
        <li>Traitement de texte compatible avec les formats .rtf et .txt (WORD 97 et supérieurs, OpenOffice, etc.)</li>
        <li>Tableur compatible avec le format .slk (EXCEL 97 et supérieurs, </li>
    </ul>
    <em>Accès au réseau Internet, boite mèl : </em> l'utilisateur devra disposer d'un accès au réseau Internet ainsi que d'une adresse mèl. Cela nécessite le raccordement par réseau à un serveur d'entreprise disposant d'un accès au réseau Internet ou un abonnement auprès d'un fournisseur d'accès Internet. 
    </p>
<h4 id="1.3">Paramétrage du logiciel de navigation</h3>
<h5 id="1.3.1">Acceptation de cookies</h4>

        </div>
        <nav class="col-xs-3 bs-docs-sidebar hidden-print" >
            <div class="fixed">
            <ul class="nav nav-stacked">
                <li class="active"><a href="#1">Environnement requis pour accéder au service</a>
                <ul class="nav nav-stacked">
                <li><a href="#1.1">Préambule</a></li>
                    <li><a href="#1.2">Connexion via internet</a></li>
                    <li><a href="#1.3">Conseils pour l'utilisation du logiciel de navigation</a></li>
                    <li><a href="#1.4">Gestion des documents</a></li>
                </ul>
                    </li>
                <li><a href="#">blablabla</a></li>
                <li><a href="#">blablabla/a></li>
                <li><a href="#">blablabla</a></li>
                <li><a href="#">blablabla</a></li>
                <li ><a href="#">v</a></li>
                <li class="menu"><a href="#">blablabla</a></li>
                <li class="menu"><a href="#">blablabla</a></li>
                <li class="menu"><a href="#">blablabla</a></li>
                <li class="menu"><a href="#">blablabla</a></li>
                <li class="menu"><a href="#">blablabla</a></li>
                <li class="menu"><a href="#">blablabla)</a></li>
                <li class="menu"><a href="#">blablabla</a></li>    
            </ul>
            </div>
        </nav>
    </div> 
</div>

</body>
</html>
4

2 回答 2

1

我刚刚发现了问题:

我的 ID(1.1、1.2 等)不起作用,它适用于没有字符的 ID.

对不起这个琐碎的问题。

于 2014-08-26T17:15:04.043 回答
0

试试这个

 <script type="text/javascript">
   $(function(){
      $('body').scrollspy({
        target: '.bs-docs-sidebar',
         offset: 40
        });
   });
</script>
于 2014-08-26T17:10:05.807 回答