Liste complexe organisée par JavaScript et
le CSS
En travaillant en tant que formateur, je suis
amené à montrer des exemples de sites ou méthodes
sur Internet. J’avais noté quelques liens que
je montrais régulièrement à mes étudiants,
et à force de mettre des liens qui se suivaient, j’ai décidé de
faire une page qui organiserait tout cela, sans que j’aie à retoucher quoi
que ce soit le jour où j’ajouterais un nouveau
lien.
Regardons en détail le fonctionnement
de cette page. Mais, tout d’abord, à quoi ressemble-t-elle.
Vous avez les fichiers dans le dossier 10_6_listeLiens ou à la
page demo.freelancetoulouse.com.
Par contre, si la fonction principale de JavaScript
est désactivée, on perd les couleurs.
La page sans couleur est le résultat
sans le fonctionnement de JavaScript, qui n’aura dans cet
exemple que la fonction de colorier l’ensemble.
Passons au code HTML :
<!DOCTYPE html>
<html>
<head>
<title>Des p’tites démos en ligne</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,
initial-scale=1.0">
<link href="https://fonts.googleapis.com/css?family=Alegreya+Sans|
Josefin+Sans|Sedgwick+Ave+Display" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Frijole" ...