Visualizzazione zoom a comparsa

Ultimo aggiornamento: 2023-05-22
  • Argomenti:
  • Dynamic Media Classic
    Visualizza ulteriori informazioni su questo argomento
  • Viewers
    Visualizza ulteriori informazioni su questo argomento
  • SDK/API
    Visualizza ulteriori informazioni su questo argomento
  • Mixed Media Sets
    Visualizza ulteriori informazioni su questo argomento
  • Creato per:
  • Developer
    User

Nella modalità zoom in linea, la visualizzazione principale è costituita dall'immagine statica. È inoltre costituito dall'immagine ingrandita visualizzata nella finestra a comparsa sull'immagine statica e dal messaggio di suggerimento visualizzato sopra l'immagine statica.

Proprietà CSS dell'area visualizzatore principale

L’aspetto della vista principale è controllato dal seguente selettore di classe CSS:

.s7mixedmediaviewer .s7flyoutzoomview

Proprietà CSS

Descrizione

background-color

Colore di sfondo della visualizzazione principale.

Esempio - per rendere trasparente la visualizzazione principale:

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

L’aspetto del messaggio di suggerimento è controllato dal seguente selettore di classe CSS:

.s7mixedmediaviewer .s7flyoutzoomview .s7tip

È possibile configurare lo stile del carattere, l'aspetto delle dimensioni e l'offset verticale tramite CSS. Tuttavia, l’allineamento orizzontale viene gestito dalla logica del visualizzatore. Sovrascriverlo tramite CSS utilizzando left o right proprietà non supportata.

Proprietà CSS del messaggio di suggerimento

Proprietà CSS

Descrizione

background-color

Colore riempimento sfondo messaggio.

border-radius

Raggio del bordo di sfondo del messaggio.

bottom

Offset dalla parte inferiore della vista principale.

color

Colore testo suggerimento.

font-size

Dimensione font.

font-family

Famiglia di caratteri.

opacità

Opacità sfondo messaggio.

riempimento

Spaziatura intorno al testo del messaggio.

Il messaggio di suggerimento può essere localizzato. Consulta Localizzazione degli elementi dell’interfaccia utente per ulteriori informazioni.

Esempio: per impostare un messaggio di suggerimento semitrasparente con il carattere bianco Arial® 12 px, 50 pixel di offset dalla parte inferiore della vista principale, spaziatura e un bordo arrotondato:

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

In questa pagina