Définir l’indicateur set-indicator
Définir l’indicateur est une série de points rendus sur les échantillons principaux lorsqu’une visionneuse est utilisée sur un appareil tactile. Les points aident les utilisateurs à parcourir les pages de miniatures lorsque les boutons de défilement ne sont pas disponibles.
Propriétés CSS de l’indicateur défini
L’aspect du conteneur indicateur défini est contrôlé par le sélecteur de classe CSS suivant :
.s7mixedmediaviewer .s7setindicator
Exemple - Pour créer un indicateur défini sur fond blanc :
.s7mixedmediaviewer .s7setindicator {
background-color: #FFFFFF;
}
L’aspect d’un point indicateur défini individuel est contrôlé par le sélecteur de classe CSS :
.s7mixedmediaviewer .s7setindicator .s7dot
state , qui peut être utilisé pour appliquer différents habillages à différents états de miniature. En particulier, state="selected" correspond à la page actuelle des miniatures, state="unselected" correspond à l’état de point par défaut.Exemple - Pour créer un point indicateur défini de 15 x 15 pixels, avec une marge horizontale de deux pixels, une marge supérieure de cinq pixels, une marge inférieure d’un pixel, un rayon de 12 pixels #D5D3D3 couleur par défaut et une couleur active #939393 :
.s7mixedmediaviewer .s7setindicator .s7dot {
width:15px;
height:15px;
margin-left:2px;
margin-top:5px;
margin-right:2px;
margin-bottom:1px;
border-radius:12px;
background-color:#D5D3D3;
}
.s7mixedmediaviewer .s7setindicator .s7dot[state="selected"] {
background-color:#939393;
}