Sidvy page-view
Huvudvyn består av katalogbilden. Den kan svepas för att komma till en annan sida eller zoomas.
CSS-egenskaper för huvudvisningsområdet
Visningsområdets utseende styrs av följande CSS-klassväljare:
.s7ecatalogsearchviewer .s7pageview
Exempel - för att göra huvudvyn genomskinlig.
.s7ecatalogsearchviewer .s7pageview {
background-color: transparent;
}
På stationära datorer har komponenten stöd för attributväljaren cursortype som kan användas på klassen .s7pageview och styr typen av markör baserat på komponentens tillstånd och användaråtgärd. Följande cursortype-värden stöds:
Den sidavgränsare som visuellt skiljer de vänstra och högra sidorna i kataloguppslaget styrs med följande CSS-klassväljare:
.s7ecatalogsearchviewer .s7pageview .s7pagedivider
Exempel - Att ha en 40 pixlar bred sidavgränsare med halvgenomskinlig bild.
.s7ecatalogsearchviewer .s7pageview .s7pagedivider {
width:40px;
background-image:url(images/sdk/divider.png);
}
frametransition är inställd på turn eller auto (på skrivbordssystem) styrs siddelarens utseende med modifieraren pageturnstyle och CSS-klassen .s7pagedivider ignoreras.Det går att konfigurera visningen av anpassade musmarkörer över huvudvisningsområdet. Den här funktionen styrs med de ytterligare attributväljarna som används för CSS-klassen .s7ecatalogsearchviewer .s7pageview:
Exempel - ha olika musmarkörer för varje typ av komponentläge.
.s7ecatalogsearchviewer .s7pageview[cursortype="default"] {
cursor:auto;
}
.s7ecatalogsearchviewer .s7pageview[cursortype="zoomin"] {
cursor:url(images/zoomin_cursor.cur), auto;
}
.s7ecatalogsearchviewer .s7pageview[cursortype="reset"] {
cursor:url(images/zoomout_cursor.cur), auto;
}
.s7ecatalogsearchviewer .s7pageview [cursortype="slide"] {
cursor:url(images/slide_cursor.cur), auto;
}
.s7ecatalogsearchviewer .s7pageview[cursortype="drag"] {
cursor:url(images/drag_cursor.cur), auto;
}