Zoomweergave flyout flyout-zoom-view

De hoofdweergave bestaat uit de statische afbeelding en de ingezoomde afbeelding die in de uitvliegweergave boven op de statische afbeelding wordt weergegeven. Het bestaat ook uit het uiteindebericht dat boven op een statische afbeelding wordt weergegeven.

CSS eigenschappen van de belangrijkste mening

De vormgeving van de hoofdweergave wordt bepaald door de volgende CSS-klassenkiezer:

.s7flyoutviewer .s7flyoutzoomview

Voorbeeld - de hoofdweergave transparant maken:

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

CSS eigenschappen van het uiteindebericht

De vormgeving van het tip-bericht wordt bepaald door de volgende CSS-klassenkiezer:

.s7flyoutviewer .s7flyoutzoomview .s7tip

Het is mogelijk lettertypestijl, tekengrootte, weergave en verticale verschuiving te configureren via CSS. De horizontale uitlijning wordt echter beheerd door de viewerlogica. Het overschrijven ervan via CSS met behulp van left - of right -eigenschappen wordt niet ondersteund.

Het tip-bericht kan worden gelokaliseerd. Zie Localisatie van gebruikersinterfaceelementenvoor meer informatie.

.

Voorbeeld - voor het instellen van een half-transparant uiteindebericht met een wit lettertype van Arial® 12 pixels, verschuiving van 50 pixels van de onderkant van de hoofdweergave, opvulling en een afgeronde rand:

.s7flyoutviewer .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);
}