Effetto icona

Guida di riferimento per i visualizzatori di Dynamic Medie
Esempi di librerie di visualizzatori
Requisiti di sistema
Installazione di più visualizzatori sullo stesso server
Note sulla versione dei visualizzatori
- Note sulla versione dei visualizzatori (5.16.5)
- Archivia
Note sulla compatibilità
Accessibilità della tastiera e navigazione
Tutorial sull’SDK per visualizzatori
Visualizzatori per AEM Assets e Dynamic Media Classic
Visualizzatori solo per AEM Assets
Riferimento comando comune a tutti i visualizzatori - Attributi di configurazione
Riferimento comando comune a tutti i visualizzatori - URL

Argomenti correlati

Contenuto correlato

Documentazione

Guida di riferimento per i visualizzatori di Dynamic Medie

Effetto icona

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
eCatalog Search
Visualizza ulteriori informazioni su questo argomento

Creato per:
Developer

User

L'indicatore di zoom si sovrappone all'area di visualizzazione principale. Viene visualizzata quando l’immagine è in stato di ripristino e dipende anche dal parametro iconeffect.

Proprietà CSS dell'area visualizzatore principale

L’aspetto dell’area di visualizzazione è controllato dal seguente selettore di classi CSS:

.s7ecatalogsearchviewer .s7pageview .s7iconeffect

Proprietà CSS	Descrizione
background-image	Illustrazione dell'indicatore di zoom.
background-position	Posizionate all'interno dello sprite del disegno, se vengono utilizzati gli sprite CSS. Vedi anche Spunti CSS .
width	Larghezza indicatore di zoom in pixel.
height	Altezza indicatore di zoom in pixel.

NOTA

L'effetto Icona supporta media-type selettore di attributi, che può essere utilizzato per applicare effetti di icona diversi a dispositivi diversi. In particolare: media-type='standard' corrisponde ai sistemi desktop in cui viene utilizzato normalmente l'input del mouse e media-type='multitouch' corrisponde ai dispositivi con input tocco.

Esempio: per impostare un indicatore di zoom di 100 x 100 pixel con immagini diverse per i sistemi desktop e i dispositivi touch.

.s7ecatalogsearchviewer .s7pageview .s7iconeffect {
 width: 100px;
 height: 100px;
}
.s7ecatalogsearchviewer .s7pageview .s7iconeffect[media-type='standard'] {
 background-image:url(images/v2/IconEffect_zoom.png);
}
.s7ecatalogsearchviewer .s7pageview .s7iconeffect[media-type='multitouch'] {
 background-image:url(images/v2/IconEffect_pinch.png);
}