Indiquer la page active dans un sommaire
Comment mettre en relief la page active parmi une liste de liens? En comparant l'URL dans la liste avec l'URL de la page courante.
Par page active, on entend la page courante, ne pas confondre avec le lien actif désigné en CSS par la pseudo classe :active qui correspond au lien sur lequel on clique le bouton de la souris.
Pour savoir si un lien dans une liste correspond à la page courante, il faut du code JavaScript.
Pour obtenir l'URL de la page courante, on utilise l'objet location et la propriété href.
var pageurl = location.href;
On change le style de la page courante dans la liste par exemple en affichant l'ancre en caractères gras ou en le soulignant. On peut aussi augmenter la taille, le décaler...
pageactive.style.fontWeight = "bold";
Le code JavaScript complet:
<script>
function relief()
{
var pageurl = location.href;
var dnl = document.getElementsByTagName("a");
for(i = 0; i < dnl.length;i++)
{
var x = dnl.item(i);
if(x.href == pageurl)
{
x.style.fontWeight = "bold";
x.style.textDecoration = "underline";
}
}
}
window.onload=relief;
</script>
Démonstration
Exemple sur un sommaire