Ange indikator set-indicator
Uppsättningsindikatorn är en serie punkter som återges längst ned i visningsprogrammet. Här visas den aktuella positionen i uppsättningen.
CSS-egenskaper för den angivna indikatorn
Utseendet på den angivna indikatorbehållaren styrs med följande CSS-klassväljare:
.s7carouselviewer .s7setindicator
mode="numeric" motsvarar det numeriska driftsläget, mode="dotted" motsvarar standardpunktläget.Anta till exempel att du vill ställa in en uppsättningsindikator med vit bakgrund:
.s7carouselviewer .s7setindicator {
background-color: #FFFFFF;
}
Utseendet på en enskild indikatorpunkt för uppsättning styrs med CSS-klassväljaren. Det gäller för objekt både i prickat och numeriskt läge.
.s7carouselviewer .s7setindicator .s7dot
state attributväljare, som kan användas för att tillämpa olika skal på olika miniatyrlägen. I synnerhet state="selected" motsvarar det aktuella elementet i uppsättningen, state="unselected" motsvarar standardobjektläget.Anta till exempel att du vill ställa in en angiven indikator i prickat läge för stationära datorer. Du vill att den ska placeras 20 pixlar från visningsprogrammets nederkant. Och du vill att omarkerade punkter ska vara svarta med 50 % genomskinlighet, 15 x 15 pixlar med sju pixlar rundade hörn. Markerade punkter är svarta med 90 % genomskinlighet, 18 x 18 pixlar med nio pixlar rundade hörn. Avståndet mellan punkter är fem pixlar.
.s7carouselviewer.s7mouseinput .s7setindicator {
bottom: 20px;
}
.s7carouselviewer.s7mouseinput .s7setindicator[mode='dotted'] .s7dot{
width:15px;
height:15px;
margin-left:2.5px;
margin-right:2.5px;
margin-top:2.5px;
margin-bottom:2.5px;
}
.s7carouselviewer.s7mouseinput .s7setindicator[mode='dotted'] .s7dot[state='selected'] {
width:18px;
height:18px;
background-color: #000000;
opacity: 0.9;
border-radius:9px;
}
.s7carouselviewer.s7mouseinput .s7setindicator[mode='dotted'] .s7dot[state='unselected'] {
width:15px;
height:15px;
background-color: #000000;
opacity: 0.5;
border-radius:7px;
}