Utfällbar zoomvy flyout-zoom-view

Huvudvyn består av den statiska bilden och den zoomade bilden som visas i den utfällbara vyn ovanpå den statiska bilden. Det består också av det tips som visas ovanpå den statiska bilden.

CSS-egenskaper för huvudvyn

Utseendet på huvudvyn styrs med följande CSS-klassväljare:

.s7flyoutviewer .s7flyoutzoomview

Exempel - för att göra huvudvyn genomskinlig:

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

CSS-egenskaper för tipsmeddelandet

Utseendet på tipsmeddelandet styrs av följande CSS-klassväljare:

.s7flyoutviewer .s7flyoutzoomview .s7tip

Det går att konfigurera teckensnittsstil, storlek, utseende och lodrät förskjutning via CSS. Den vågräta justeringen hanteras emellertid av visningsprogrammets logik. Det går inte att åsidosätta den via CSS med egenskaperna left eller right.

Tipsmeddelandet kan lokaliseras. Mer information finns i Lokalisering av användargränssnittselement.

.

Exempel - Om du vill ställa in ett halvgenomskinligt tips med vitt Arial® 12-px-teckensnitt, förskjuts 50 pixlar från huvudvyns nederkant, utfyllnad och en rundad kant:

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