Knop Zoomen opnieuw instellen
Gemaakt voor:
- Ontwikkelaar
- Gebruiker
Als u deze knop selecteert of tikt, wordt een afbeelding in de hoofdweergave opnieuw ingesteld. Deze knop wordt weergegeven in de hoofdbesturingsbalk op desktopsystemen en tablets. Op mobiele telefoons wordt deze knop in het midden onder op de afbeelding weergegeven. De voorinstelling wordt echter niet weergegeven wanneer de afbeelding is hersteld. 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:
.s7ecatalogviewer .s7zoomresetbutton
CSS-eigenschap | Beschrijving |
---|---|
top | Plaats vanaf de bovenrand van de hoofdbesturingsbalk (op desktops en tablets) of viewer (op mobiele telefoons), inclusief opvulling. |
right | Plaats vanaf de rechterrand van de hoofdbesturingsbalk (op desktops en tablets) of viewer (op mobiele telefoons), inclusief opvulling. |
left | Positie vanaf de linkerrand van de hoofdbesturingsbalk (op desktops en tablets) of viewer (op mobiele telefoons), inclusief opvulling. |
bottom | Plaats vanaf de onderrand van de hoofdbesturingsbalk (op desktops en tablets) of viewer (op mobiele telefoons), 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 ook CSS-sprites. |
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 voor meer informatie .
Voorbeeld - Een knop voor het opnieuw instellen van zoomen instellen van 28 x 28 pixels en gepositioneerd (op het bureaublad) 4 pixels van de onderrand en 47 pixels van de rechterrand van de hoofdbesturingsbalk. En tenslotte, toont een verschillend beeld voor elk van de vier verschillende knoopstaten.
.s7ecatalogviewer .s7zoomresetbutton {
bottom:4px;
right:47px;
width:28px;
height:28px;
}
.s7ecatalogviewer .s7zoomresetbutton [state='up'] {
background-image:url(images/v2/ZoomResetButton_dark_up.png);
}
.s7ecatalogviewer .s7zoomresetbutton [state='over'] {
background-image:url(images/v2/ZoomResettButton_dark_over.png);
}
.s7ecatalogviewer .s7zoomresetbutton [state='down'] {
background-image:url(images/v2/ZoomResetButton_dark_down.png);
}
.s7ecatalogviewer .s7zoomresetbutton [state='disabled'] {
background-image:url(images/v2/ZoomResetButton_dark_disabled.png);
}