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:

.s7video360viewer .s7socialshare

CSS eigenschappen van het sociale aandeelhulpmiddel

Voorbeeld - aan opstelling een sociaal delend hulpmiddel dat vier pixel van de bovenkant en vijf pixel van het recht van kijkerscontainer wordt geplaatst en grootte 28 x 28 pixel is.

.s7interactivevideoviewer .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:

.s7video360viewer .s7socialshare .s7socialbutton

CSS eigenschappen van de sociale knoop van het aandeelhulpmiddel

De knopinfo kan worden gelokaliseerd. Zie ​ Localisatie van gebruikersinterfaceelementen ​.

Voorbeeld - aan opstelling een sociale het delen hulpmiddelknoop die een verschillend beeld voor elk van de vier verschillende knoopstaten toont.

.s7video360viewer .s7socialshare .s7socialbutton[state='up'] {
background-image:url(images/v2/SocialShare_video_dark_up.png);
}
.s7video360viewer .s7socialshare .s7socialbutton[state='over'] {
background-image:url(images/v2/SocialShare_dark_over.png);
}
.s7video360viewer .s7socialshare .s7socialbutton[state='down'] {
background-image:url(images/v2/SocialShare_dark_down.png);
}
.s7video360viewer .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:

.s7video360viewer .s7socialshare .s7socialsharepanel

CSS eigenschappen van het sociale deelpaneel

Voorbeeld - aan opstelling een paneel om transparante kleur te hebben:

.s7video360viewer .s7socialshare .s7socialsharepanel {
 background-color: transparent;
}