279
Étude de cas : Climb the Mountains

Étude de cas : Climb the Mountains

Nous.utiliserons.ces.classes.uniques.pour.définir.la.position.d’affichage.de.chaque.élément.
de.liste.sur.le.graphique,.en.définissant.les.coordonnées.à.partir.du.coin.supérieur.gauche.du.
conteneur.de.graphique.d’altitude.
.home div#route_elevation li.marker_01 {
top:123px;
left:97px;
}
.home div#route_elevation li.marker_02 {
top:50px;
left:237px;
}
.home div#route_elevation li.marker_03 {
top:95px;
left:377px;
}
.home div#route_elevation li.marker_04 {
top:137px;
left:517px;
}
Nous.ne.sommes.qu’en.cours.de.chemin,.aussi.ne.disposons-nous.pour.l’instant.que.d’un.
paquet.d’éléments.de.liste,.avec.pour.chacun.une.hauteur.et.une.image,.empilés.à.gauche.du.
conteneur.(voir.Figure 11.25).
Figure 11.25
Les éléments de liste
sont empilés à gauche.
Avant.de.forcer.les.éléments.de.liste.à.se.situer.aux.emplacements.désirés,.commençons.par.
masquer.les.images.et.choisissons.un.graphisme.de.marqueur.plus.approprié..Le.graphisme.
que.nous.allons.utiliser.correspond.au.point.classique.présenté.à.la.Figure 11.26..Le.fichier.
est.nommé.elevation_marker.png.
Figure 11.26
Le graphisme de
marqueur.
