Sociaal aandeel social-share

Het gereedschap Delen via sociale media wordt standaard in de rechterbovenhoek weergegeven. Het bestaat uit een knop en een deelvenster dat groter wordt wanneer de gebruiker op een knop klikt of tikt en dat afzonderlijke gereedschappen voor delen bevat.

De positie en grootte van het gereedschap voor sociaal delen in de gebruikersinterface van de viewer worden als volgt bepaald:

.s7videoviewer .s7socialshare

CSS-eigenschappen van het gereedschap voor sociaal delen

top
Verticale positie van het gereedschap voor sociaal delen ten opzichte van de viewercontainer.
left
Horizontale positie van het gereedschap voor sociaal delen ten opzichte van de viewercontainer.
width
De breedte van het gereedschap voor sociaal delen.
height
De hoogte van het gereedschap voor sociaal delen.

Voorbeeld: stel een gereedschap voor sociaal delen in dat zich vier pixels van de bovenkant en vijf pixels van de rechterkant van de viewercontainer bevindt en dat een formaat heeft van 28 x 28 pixels.

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

De vormgeving van de knop voor het gereedschap Sociaal delen wordt bepaald door de volgende CSS-klassenkiezer:

.s7videoviewer .s7socialshare .s7socialbutton

CSS-eigenschappen van de sociale knop

achtergrondafbeelding
De afbeelding die voor een bepaalde knopstatus wordt weergegeven.
background-position

Positie binnen illustratie-sprite, als CSS-sprites worden gebruikt.

Zie CSS-sprites.

NOTE
Deze knop ondersteunt de state kenmerkenkiezer, die kan worden gebruikt om verschillende skins toe te passen op verschillende knoptoestanden.

De knopinfo kan worden gelokaliseerd. Zie Lokalisatie van gebruikersinterface-elementen voor meer informatie .

Voorbeeld - stel een knop voor een gereedschap voor sociaal delen in, waarmee een andere afbeelding wordt weergegeven voor elk van de vier verschillende knopstatussen.

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

De weergave van het deelvenster met de afzonderlijke pictogrammen voor sociaal delen wordt bepaald door de volgende CSS-klassenkiezer:

.s7videoviewer .s7socialshare .s7socialsharepanel

CSS-eigenschappen van het deelvenster voor sociaal delen

background-color
De achtergrondkleur van het deelvenster.

Voorbeeld - een deelvenster instellen om een transparante kleur te krijgen:

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