Condivisione social social-share

Per impostazione predefinita, lo strumento condivisione social viene visualizzato nell'angolo in alto a destra. È costituito da un pulsante e da un pannello che si espande quando l’utente fa clic o tocca un pulsante e contiene singoli strumenti di condivisione.

La posizione e le dimensioni dello strumento di condivisione social network nell’interfaccia utente del visualizzatore sono controllate da quanto segue:

.s7smartcropvideoviewer .s7socialshare

Proprietà CSS dello strumento condivisione social

primi
Posizione verticale dello strumento di condivisione social network rispetto al contenitore del visualizzatore.
ha lasciato
Posizione orizzontale dello strumento di condivisione social network rispetto al contenitore del visualizzatore.
larghezza
Larghezza dello strumento di condivisione social.
altezza
Altezza dello strumento di condivisione social.

Esempio: configura uno strumento di condivisione social, posizionato a quattro pixel dall’alto e a cinque pixel dalla destra del contenitore visualizzatore e ridimensionato a 28 x 28 pixel.

.s7smartcropvideoviewer .s7socialshare {
 top:4px;
 right:5px;
 width:28px;
 height:28px;
}

L’aspetto del pulsante dello strumento Condivisione social è controllato dal seguente selettore di classe CSS:

.s7smartcropvideoviewer .s7socialshare .s7socialbutton

Proprietà CSS del pulsante social

immagine di sfondo
Immagine visualizzata per un determinato stato del pulsante.
background-position

Posizionate all'interno dello sprite del disegno, se vengono utilizzati gli sprite CSS.

Vedere sprite CSS.

NOTE
Questo pulsante supporta il selettore di attributi state, che può essere utilizzato per applicare interfacce diverse a diversi stati di pulsante.

La descrizione comando del pulsante può essere localizzata. Per ulteriori informazioni, vedere Localizzazione degli elementi dell'interfaccia utente.

Esempio: imposta un pulsante per lo strumento di condivisione social che visualizza un’immagine diversa per ciascuno dei quattro diversi stati dei pulsanti.

.s7smartcropvideoviewer .s7socialshare .s7socialbutton[state='up'] {
background-image:url(images/v2/SocialShare_video_dark_up.png);
}
.s7smartcropvideoviewer .s7socialshare .s7socialbutton[state='over'] {
background-image:url(images/v2/SocialShare_dark_over.png);
}
.s7smartcropvideoviewer .s7socialshare .s7socialbutton[state='down'] {
background-image:url(images/v2/SocialShare_dark_down.png);
}
.s7smartcropvideoviewer .s7socialshare .s7socialbutton[state='disabled'] {
background-image:url(images/v2/SocialShare_dark_disabled.png);
}

L’aspetto del pannello che contiene le singole icone di condivisione social è controllato dal seguente selettore di classe CSS:

.s7smartcropvideoviewer .s7socialshare .s7socialsharepanel

Proprietà CSS del pannello condivisione social

colore di sfondo
Colore di sfondo del pannello.

Esempio: impostare un pannello con un colore trasparente:

.s7smartcropvideoviewer .s7socialshare .s7socialsharepanel {
 background-color: transparent;
}
recommendation-more-help
b7426f53-aad9-4c00-83fc-664f30f681e8