Affichage de zoom déroulant flyout-zoom-view

En mode zoom intégré, la vue principale est constituée d’une image statique. Il se compose également de l’image agrandie affichée dans la vue déroulante sur l’image statique et du message de conseil affiché au-dessus de l’image statique.

Propriétés CSS de la zone principale de la visionneuse

L’aspect de la vue principale est contrôlé par le sélecteur de classe CSS suivant :

.s7mixedmediaviewer .s7flyoutzoomview

Exemple - pour rendre la vue principale transparente :

.s7mixedmediaviewer .s7flyoutzoomview {
 background-color: transparent;
}

L’aspect du message de conseil est contrôlé par le sélecteur de classe CSS suivant :

.s7mixedmediaviewer .s7flyoutzoomview .s7tip

Il est possible de configurer le style de police, l’apparence de la taille et le décalage vertical via CSS. Toutefois, l’alignement horizontal est géré par la logique de la visionneuse. Il n’est pas possible de le remplacer par le biais de CSS à l’aide left des propriétés OR right .

Propriétés CSS du message de conseil

Le message du conseil peut être localisé. Pour plus d’informations, voir Localisation des éléments de l’interface utilisateur.

Exemple - Pour configurer un message de conseil semi-transparent avec une police Arial® blanche de 12 px, avec un décalage de 50 pixels par rapport au bas de la vue principale, une marge intérieure et une bordure arrondie :

.s7mixedmediaviewer .s7flyoutzoomview .s7tip {
bottom: 50px;
color: #ffffff;
font-family: Arial;
font-size: 12px;
padding-bottom: 10px;
padding-top: 10px;
padding-left: 12px;
padding-right: 12px;
background-color: #000000;
border-radius: 4px;
opacity: 0.5;
filter: alpha(opacity = 50);
}