Knop Uitzoomen zoom-out-button

Als u deze knop selecteert of tikt, wordt uitgezoomd op een afbeelding in de hoofdweergave. Deze knop wordt niet weergegeven op mobiele telefoons om de schermruimte op te slaan. U kunt deze knop vergroten, verkleinen, verkleinen en plaatsen met CSS.

CSS-eigenschappen van het hoofdviewergebied

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

.s7zoomviewer .s7zoomoutbutton
CSS-eigenschap
Beschrijving
top
Positie vanaf de bovenrand, inclusief opvulling.
right
Positie vanaf de rechterrand, inclusief opvulling.
left
Positie vanaf de linkerrand, inclusief opvulling.
bottom
Positie vanaf de onderrand, inclusief opvulling.
width
Breedte van de knop.
height
Hoogte van de knop.
achtergrondafbeelding
De afbeelding die voor een bepaalde knopstatus wordt weergegeven.
background-position

Positie binnen illustratie-sprite, als CSS-sprites worden gebruikt.

Zie CSS-sprites.

NOTE
Deze knop ondersteunt de state kenmerkenkiezer, die kan worden gebruikt om verschillende skins toe te passen op verschillende knoptoestanden.

De knopinfo kan worden gelokaliseerd. Zie Lokalisatie van gebruikersinterface-elementen.

Voorbeeld - Een uitzoomknop van 32 x 32 pixels instellen en 6 pixels van de boven- en rechterrand van de viewer plaatsen. En tenslotte, toont een verschillend beeld voor elk van de vier verschillende knoopstaten.

.s7zoomviewer .s7zoomoutbutton {
top:6px;
right:6px;
width:32px;
height:32px;
}
.s7zoomviewer .s7zoomoutbutton [state='up'] {
background-image:url(images/v2/ZoomOutButton_dark_up.png);
}
.s7zoomviewer .s7zoomoutbutton [state='over'] {
background-image:url(images/v2/ZoomOutButton_dark_over.png);
}
.s7zoomviewer .s7zoomoutbutton [state='down'] {
background-image:url(images/v2/ZoomOutButton_dark_down.png);
}
.s7zoomviewer .s7zoomoutbutton [state='disabled'] {
background-image:url(images/v2/ZoomOutButton_dark_disabled.png);
}
recommendation-more-help
b7426f53-aad9-4c00-83fc-664f30f681e8