Knappen Miniatyrbilder thumbnails-button
Om du väljer den här knappen återställs visningsprogrammet mellan huvudvyn och miniatyrbilderna. Den här knappen visas i huvudkontrollfältet. Du kan ändra storlek, skal och position för knappen med hjälp av CSS.
CSS-egenskaper för huvudvisningsområdet
Knappens utseende styrs med följande CSS-klassväljare:
.s7ecatalogsearchviewer .s7thumbnailpagebutton
Placera inuti en teckningssprite, om CSS-sprites används.
Se även CSS-fragment.
state och selected som kan användas för att tillämpa olika skal på olika knapplägen. selected='true' motsvarar i synnerhet visningsprogrammets läge när miniatyrbildsläget är aktivt och selected='false' motsvarar standardläget med huvudvyn.Knappens funktionsbeskrivning kan lokaliseras. Mer information finns i Lokalisering av användargränssnittselement.
Exempel - Om du vill ställa in en miniatyrknapp som är 28 x 28 pixlar och placerad 4 pixlar från nederkanten och 5 pixlar från den vänstra kanten av huvudkontrollfältet. Och slutligen, visar en annan bild för vart och ett av de fyra olika knapplägena när de är markerade eller inte markerade.
.s7ecatalogsearchviewer .s7thumbnailpagebutton{
margin-top: 4px;
margin-left: 5px; width:28px;
height:28px;
}
.s7ecatalogsearchviewer .s7thumbnailpagebutton [selected='false'][state='up'] {
background-image:url(images/v2/ThumbnailPageButton_dark_up.png);
}
.s7ecatalogsearchviewer .s7thumbnailpagebutton [selected='false'][state='over'] {
background-image:url(images/v2/ThumbnailPageButton_dark_over.png);
}
.s7ecatalogsearchviewer .s7thumbnailpagebutton [selected='false'][state='down'] {
background-image:url(images/v2/ThumbnailPageButton_dark_down.png);
}
.s7ecatalogsearchviewer .s7thumbnailpagebutton [selected='false'][state='disabled'] {
background-image:url(images/v2/ThumbnailPageButton_dark_disabled.png);
}
.s7ecatalogsearchviewer .s7thumbnailpagebutton [selected='true'][state='up'] {
background-image:url(images/v2/ThumbnailPageButton_dark_over.png);
}
.s7ecatalogsearchviewer .s7thumbnailpagebutton [selected='true'][state='over'] {
background-image:url(images/v2/ThumbnailPageButton_dark_over.png);
}
.s7ecatalogsearchviewer .s7thumbnailpagebutton [selected='true'][state='down'] {
background-image:url(images/v2/ThumbnailPageButton_dark_over.png);
}
.s7ecatalogsearchviewer .s7thumbnailpagebutton [selected='true'][state='disabled'] {
background-image:url(images/v2/ThumbnailPageButton_dark_disabled.png);
}