Zoomweergave flyout flyout-zoom-view

In de inline zoommodus bestaat de hoofdweergave uit de statische afbeelding. Het bestaat ook uit de ingezoomde afbeelding die in de uitvliegweergave boven de statische afbeelding wordt getoond, en het uiteindebericht dat boven op de statische afbeelding wordt weergegeven.

CSS eigenschappen van het belangrijkste viewergebied

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

.s7mixedmediaviewer .s7flyoutzoomview

Voorbeeld - de hoofdweergave transparant maken:

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

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

.s7mixedmediaviewer .s7flyoutzoomview .s7tip

Het is mogelijk om lettertypestijl, vormgeving van grootte 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.

CSS eigenschappen van het uiteindebericht

Het tip-bericht kan worden gelokaliseerd. Zie ​ Localisatie van gebruikersinterfaceelementen ​ voor meer informatie.

Voorbeeld - Als u een half-transparant tip-bericht wilt instellen met een wit lettertype van Arial® 12 pixels, verschuift dit 50 pixels van de onderkant van de hoofdweergave, de opvulling en een afgeronde rand:

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