Knappen Zooma in

Senast uppdaterad: 22 juli 2024
  • Ämnen:

Skapat för:

  • Utvecklare
  • Användare

Om du väljer den här knappen zoomas bilden in i huvudvyn. Den här knappen visas i huvudkontrollfältet. Den här knappen visas inte på mobiltelefoner för att spara skärmutrymme. 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 .s7zoominbutton

CSS-egenskapBeskrivning
övrePlacera från huvudkontrollfältets övre kant, inklusive utfyllnad.
högerPlacera från den högra kanten av huvudkontrollfältet, inklusive utfyllnad.
kvarPlacera från vänster kant på huvudkontrollfältet, inklusive utfyllnad.
nederkantPlacera från den nedre kanten av huvudkontrollfältet, inklusive utfyllnad.
widthKnappens bredd.
heightKnappens höjd.
background-imageBilden som visas för ett visst knappläge.
background-position

Placera inuti en teckningssprite, om CSS-sprites används.

Se även CSS-fragment.

NOTE
Den här knappen stöder attributväljaren state som kan användas för att tillämpa olika skal på olika knapplägen.

Knappens funktionsbeskrivning kan lokaliseras. Mer information finns i Lokalisering av användargränssnittselement.

Exempel - För att ställa in en inzoomningsknapp som är 28 x 28 pixlar och placerad 4 pixlar från den nedre och 103 pixlar från den högra kanten av huvudkontrollfältet. Slutligen visas olika bilder för de fyra olika knapplägena.

.s7ecatalogsearchviewer .s7zoominbutton {
bottom:4px;
right:103px;
width:28px;
height:28px;
}
.s7ecatalogsearchviewer .s7zoominbutton [state='up'] {
background-image:url(images/v2/ZoomInButton_dark_up.png);
}
.s7ecatalogsearchviewer .s7zoominbutton [state='over'] {
background-image:url(images/v2/ZoomInButton_dark_over.png);
}
.s7ecatalogsearchviewer .s7zoominbutton [state='down'] {
background-image:url(images/v2/ZoomInButton_dark_down.png);
}
.s7ecatalogsearchviewer .s7zoominbutton [state='disabled'] {
background-image:url(images/v2/ZoomInButton_dark_disabled.png);
}
Föregående sidaKnappen Visa alla favoriter
Nästa sidaKnappen Zooma ut

Experience Manager