135
Mise en forme des listes et création de barres de navigation
.remote a:hover .hotspot,
.remote a:focus .hotspot {
border: 1px solid #fff;
}
De.la.même.manière,.pour.changer.la.couleur.du.texte.lorsque.l’utilisateur.survole.le.texte.
ou.la.zone.réactive,.vous.devez.changer.le.style.de.la.balise.span.lorsque.l’ancre.parente.est.
survolée.ou.activée :
.remote a:hover .link ,
.remote a:focus .link {
color: #0066FF;
}
Si.vous.testez.cet.exemple,.vous.verrez.qu’il.fonctionne.parfaitement.dans.Safari.et.Firefox.
(voir.Figure 6.15)..Lorsque.vous.survolez.le.nom.d’une.personne,.le.texte.du.lien.change.de.
couleur,.et.une.boîte.apparaît.au-dessus.de.la.personne.dans.l’image..Le.même.événement.
se.produit.quand.vous.survolez.la.personne.dans.l’image..
Figure 6.15
Démonstration du
survol distant. Lorsque
l’utilisateur survole
le texte du lien à
côté de l’image, un
contour apparaît
sur la personne
correspondante dans
l’image.
La.mise.en.forme.de.cet.exemple.est.assez.simple,.mais.rien.ne.vous.limite.pourtant,.hormis.
votre.imagination..Nous.avons.d’ailleurs.utilisé.une.version.légèrement.modifiée.de.cette.
technique.dans.la.section."Qui.sommes-nous ?".du.site.Clearleft.(http://clearleft.com/is/).
[voir.Figure 6.16].