Knop PlayPause playpause-button

Met de knop Afspelen/Pauzeren kan een gebruiker het automatisch afspelen van carrousels pauzeren of hervatten.

De knop is alleen zichtbaar als de parameter CarouselViewer.autoplay is ingesteld op 1 ; anders is de knop verborgen. U kunt deze knop groter of kleiner maken en plaatsen ten opzichte van de besturingsbalk die de knop bevat, door CSS te gebruiken.

CSS eigenschappen van het belangrijkste viewergebied

De vormgeving van de knop wordt bepaald door de volgende CSS-klassenkiezer:

.s7carouselviewer .s7playpausebutton

De knopinfo kan worden gelokaliseerd. Zie Localisatie van gebruikersinterfaceelementenvoor meer informatie.

Stel dat u bijvoorbeeld een pauzeknop wilt instellen van 28 x 28 pixels. U wilt dat de knop zich 17 pixels van de onderkant en 12 pixels van de linkerrand van de viewer bevindt. En u wilt dat er een andere afbeelding wordt weergegeven voor elk van de vier verschillende knoptoestanden wanneer deze is geselecteerd of niet.

.s7carouselviewer .s7playpausebutton {
bottom:17px;
left:12px;
width:28px;
height:28px;
}
.s7carouselviewer .s7playpausebutton[selected='true'][state='up'] {
  background-image:url(images/playBtn_up.png);
}
.s7carouselviewer .s7playpausebutton[selected='true'][state='over'] {
background-image:url(images/playBtn_over.png);
}
.s7carouselviewer .s7playpausebutton[selected='true'][state='down'] {
background-image:url(images/playBtn_down.png);
}
.s7carouselviewer .s7playpausebutton[selected='true'][state='disabled'] {
background-image:url(images/playBtn_disabled.png);
}
.s7carouselviewer .s7playpausebutton[selected='false'][state='up'] {
background-image:url(images/pauseBtn_up.png);
}
.s7carouselviewer .s7playpausebutton[selected='false'][state='over'] {
background-image:url(images/pauseBtn_over.png);
}
.s7carouselviewer .s7playpausebutton[selected='false'][state='down'] {
background-image:url(images/pauseBtn_down.png);
}