Dokumentation Referenshandbok för Dynamic Media Viewer

helskärmsknapp

Senast uppdaterad: 22 juli 2024

Ämnen:

Skapat för:

Utvecklare
Användare

Helskärmsknappen gör att videospelaren Smart Crop (smart beskärning) går in i eller avslutar helskärmsläget när en användare klickar på den.

Du kan ändra storlek, skal och position för helskärmsknappen, i förhållande till kontrollfältet som innehåller den, enligt CSS.

Utseendet på helskärmsknappen styrs av CSS-klassväljaren:

.s7smartcropvideoviewer .s7fullscreenbutton

CSS-egenskaper för helskärmsknappen

övre	Placera från den övre kanten, inklusive utfyllnad.
höger	Placera från den högra kanten, inklusive utfyllnad.
kvar	Placera från den vänstra kanten, inklusive utfyllnad.
nederkant	Placera från den nedre kanten, inklusive utfyllnad.
width	Helskärmsknappens bredd.
height	Helskärmsknappens höjd.
background-image	Den bild som visas för ett visst knappläge.
background-position	Placera inuti en teckningssprite, om CSS-sprites används. Se CSS-fragment.

NOTE

Den här knappen stöder både attributväljarna state och selected som kan användas för att tillämpa olika skal på olika knapplägen. selected='true' motsvarar i synnerhet helskärmsläget och selected='false' motsvarar normalläget.

Knappens funktionsbeskrivning kan lokaliseras. Mer information finns i Lokalisering av användargränssnittselement.

Exempel

Om du vill ställa in en helskärmsknapp som är 32 x 32 pixlar och placerad 6 pixlar från kontrollfältets övre och högra kant. Du kan även visa olika bilder för vart och ett av de fyra olika knapplägena när du markerar dem eller inte markerar dem.

.s7smartcropvideoviewer . s7fullscreenbutton {
top:6px;
right:6px;
width:32px;
height:32px;
}
.s7smartcropvideoviewer .s7fullscreenbutton [selected='false'][state='up'] {
background-image:url(images/enterFullBtn_up.png);
}
.s7smartcropvideoviewer .s7fullscreenbutton [selected='false'][state='over'] {
background-image:url(images/enterFullBtn_over.png);
}
.s7smartcropvideoviewer .s7fullscreenbutton [selected='false'][state='down'] {
background-image:url(images/enterFullBtn_down.png);
}
.s7smartcropvideoviewer .s7fullscreenbutton [selected='false'][state='disabled'] {
background-image:url(images/enterFullBtn_disabled.png);
}
.s7smartcropvideoviewer .s7fullscreenbutton [selected='true'][state='up'] {
background-image:url(images/exitFullBtn_up.png);
}
.s7smartcropvideoviewer .s7fullscreenbutton [selected='true'][state='over'] {
background-image:url(images/exitFullBtn_over.png);
}
.s7smartcropvideoviewer .s7fullscreenbutton [selected='true'][state='down'] {
background-image:url(images/exitFullBtn_down.png);
}
.s7smartcropvideoviewer .s7fullscreenbutton [selected='true'][state='disabled'] {
background-image:url(images/exitFullBtn_disabled.png); }
}

recommendation-more-help