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 hoofdviewergebied

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

.s7mixedmediaviewer .s7flyoutzoomview

Voorbeeld - om de hoofdweergave transparant te 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. Overschrijven met CSS left of right eigenschappen worden niet ondersteund.

CSS-eigenschappen van het tip-bericht

Het tip-bericht kan worden gelokaliseerd. Zie Lokalisatie van gebruikersinterface-elementen 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);
}