我正在努力做一个漂亮的导航栏,就像你可以在" getstarted"来自Bootstrap的页面。
到目前为止,很多工作正在进行,除了将在good元素上应用活动状态的scrollspy。
我不知道为什么它不起作用我确实修正了一个高度:我在其他问题中建议<body>
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>
答案 0 :(得分:1)
我刚刚发现了问题:
我的ID(1.1,1.2等)不起作用,ID没有字符.
对不起这个微不足道的问题。
答案 1 :(得分:0)
试试这个
<script type="text/javascript">
$(function(){
$('body').scrollspy({
target: '.bs-docs-sidebar',
offset: 40
});
});
</script>