Sommaire Jquey
analoulou
-
jordane45 Messages postés 38486 Date d'inscription Statut Modérateur Dernière intervention -
jordane45 Messages postés 38486 Date d'inscription Statut Modérateur Dernière intervention -
Bonjour,
Je souhaite faire un sommaire dans lequel la couleur du titre du sommaire change en fonction du contenu scrollé. (Pour faire plus simple, c'est dans ce style la : http://bl-spf:82/page-contenus-2col.html
Pour l'instant j'ai juste ce code HTML, avec le sommaire et le contenu, mais je ne vois pas comment faire en jquery, j'ai essayé plusieurs tutos sans succès... Pouvez vous m'aider ?
Code html :
Merci
Je souhaite faire un sommaire dans lequel la couleur du titre du sommaire change en fonction du contenu scrollé. (Pour faire plus simple, c'est dans ce style la : http://bl-spf:82/page-contenus-2col.html
Pour l'instant j'ai juste ce code HTML, avec le sommaire et le contenu, mais je ne vois pas comment faire en jquery, j'ai essayé plusieurs tutos sans succès... Pouvez vous m'aider ?
Code html :
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="sommaire.js"></script>
</head>
<body>
<div id="left">
<h2 id="introduction">INTRO</h2>
<p>AZERTY AZERTY</br> AZERTY AZERTY AZERTY</br> AZERTY AZERTY AZERTY</br> AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY </p>
<h2 id="contenu">CONTENU</h2>
<p>AZERTY AZERTY</br> AZERTY AZERTY AZERTY</br> AZERTY AZERTY AZERTY</br> AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY </p>
<h3 id="concept">concept</h3>
<p>AZERTY AZERTY</br> AZERTY AZERTY AZERTY</br> AZERTY AZERTY AZERTY</br> AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY </p>
<h3 id="application">application</h3>
<p>AZERTY AZERTY</br> AZERTY AZERTY AZERTY</br> AZERTY AZERTY AZERTY</br> AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY </p>
<h3 id="demonstration">demonstration</h3>
<p>AZERTY AZERTY</br> AZERTY AZERTY AZERTY</br> AZERTY AZERTY AZERTY</br> AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY </p>
<h2 id="conclusion">CONCLUSION</h2>
<p>AZERTY AZERTY</br> AZERTY AZERTY AZERTY</br> AZERTY AZERTY AZERTY</br> AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY AZERTY </p>
</div>
<div id="right">
<!-- Sommaire -->
<ul id="sommaire">
<!-- H2 -->
<li class="toc2">
<span class="sommaireTitreNumerote numero1">1</span>
<a href="#introduction" rel="nofollow noopener noreferrer" target="_blank" class="toclink">Introduction</a>
</li>
<!-- H2 -->
<li class="toc2">
<span class="sommaireTitreNumerote numero2">2</span>
<a href="#contenu" rel="nofollow noopener noreferrer" target="_blank" class="toclink">Contenu</a>
</li>
<!-- H3 -->
<li class="toc3">
<a href="#concept" rel="nofollow noopener noreferrer" target="_blank" class="toclink">Concept</a>
</li>
<!-- H3 -->
<li class="toc3">
<a href="#application" rel="nofollow noopener noreferrer" target="_blank" class="toclink">Application</a>
</li>
<!-- H3 -->
<li class="toc3">
<a href="#demonstration" rel="nofollow noopener noreferrer" target="_blank" class="toclink">Demonstration</a>
</li>
<!-- H2 -->
<li class="toc2">
<span class="sommaireTitreNumerote numero4 current">3</span>
<a href="#conclusion" rel="nofollow noopener noreferrer" target="_blank" class="toclink">Conclusion</a>
</li>
</ul>
</div>
</body>
</html>
Merci
A voir également:
- Sommaire Jquey
- Sommaire word - Guide
- Exemple sommaire rapport de stage - Guide
- Numérotation page word après sommaire - Guide
- Comment faire les pointillés d'un sommaire sur word - Guide
- Sommaire des annexes - Forum Word