This page uses JavaScript and requires a JavaScript enabled browser.Your browser is not JavaScript enabled.
Demo:Loading...
Demo:Skip to content
Please visit the Accessibility link to enable screen reader optimized content.
carousel Demo
Accessibility
About 11.1.2.4.0...
Home
O
Documentation
Tag Doc...
Skinning...
Release Information...
JavaDoc...
JS Doc...
Component Sub-ID Documentation...
Related Demos
Tag Demo
View Source
Page...
Page Template...
Global Tools Fragment...
Skin
Custom
Extends fusion
richDemo
Extends fusion-simple
gold
README
flip the themes
gold - set colors
gold - generated images
gold - final version
green
green
greenNoImages
Extends blafplus
princess
rainforest
sporty
Extends simple
debug
Fusion
fusionFx v2.1
fusionFx v2
fusionFx v1.1
fusionFx
fusion-11.1.1.3.0
fusion
Fusion Simple (easy to colorize)
fusionFx-simple v2.1
fusionFx-simple v2
fusionFx-simple v1.1
fusionFx-simple
fusion-simple
BLAF+
blafplus-rich
blafplus-medium
simple
Settings
I use a screen reader
I use high contrast
I use large fonts
Enable animations
Optimize partial page rendering
Tabbed presentation
Change to dimensions from children
Change to dimensions from parent
Skinning
-->
carousel Demo
Bookmarkable Link
Find
Tag Guide
Skinning
Alphabetical
V
Skinning
>
Input
>
Layout
>
List of Values
>
Menu and Toolbar
>
Miscellaneous
>
Navigation
>
Output
>
Popup
>
Query
>
Table
>
Features
Demo:Collapse
Demo:Expand
Demo:Expand All Below
Demo:Collapse All Below
Demo:Show as Top
Feature Demos
Visual Designs
Styles
Commonly Confused
Tag Guide
Skinning
Feature Demos
Visual Designs
Styles
Commonly Confused
This page demos carousel's skinning keys that are defined in the demoComponents skin.
v
Style Selectors
…
Select the styles that you wish to see displayed in the panel on the right.
Select the styles that you wish to see displayed in the panel on the right.
Demo:All
af|carousel {width: 100%; background-color: seashell}
af|carousel:vertical {width: 300px; height: 500px}
af|carousel::item:circular {border: 1px solid deeppink}
af|carousel::view:one-by-one {border:1px solid cyan;}
af|carousel::item-overlay {background-color: teal}
af|carousel::item-text {font-style: italic; color: red}
af|carousel::item-text:vertical {background-color: antiquewhite; color: darkorange; border:1px solid darkorange; padding: 10px}
af|carousel::item-text:small:vertical {background-color:transparent;border-width:0px;}
af|carousel::item-text:compact:vertical {background-color:transparent;border-width:0px;}
af|carousel::control-area:small {padding:10px;}
af|carousel::control-area:small:vertical {background-color: ivory; border: 1px solid yellow;}
af|carousel::control-area:compact {padding:15px;}
af|carousel::control-area:compact:vertical {background-color: lightgreen; border: 1px solid green;}
af|carousel::spin-info {color: maroon; font-size: 14px}
af|carousel::spin-info:vertical {color: olive; font-size: 12px}
af|carousel::spin-info:small {font-size:8px;}
af|carousel::status-message {border: 10px; padding: 10px; background-color: darkgreen; color: yellowgreen; font-size: 18px}
af|carousel::status-icon-style {background-image: url('/images/demoSkin/cloud.png'); width: 60px; height: 60px;}
af|carousel::spin-bar {background-repeat: repeat-x; background-image: url('/images/demoSkin/carousel-spin-bar-h.png'); background-position: center center; left: 5%; right: 5%; height: 48px}
af|carousel::spin-bar:disabled {background-image: url('/images/demoSkin/carousel-spin-bar-h-d.png')}
af|carousel::spin-bar:vertical {background-repeat: repeat-y; background-image: url('/images/demoSkin/carousel-spin-bar-v.png'); top: 5%; bottom: 5%; width: 48px; left:auto; right: auto; height: auto}
af|carousel::spin-bar:vertical:disabled {background-image: url('/images/demoSkin/carousel-spin-bar-v-d.png')}
af|carousel::spin-h-previous-icon-style:ltr {height: 48px; width: 22px; background-image: url('/images/demoSkin/carousel-spin-left.png'); right: 95%}
af|carousel::spin-h-previous-icon-style:rtl {height: 48px; width: 22px; background-image: url('/images/demoSkin/carousel-spin-right.png'); left: 95%}
af|carousel::spin-h-previous-icon-style:disabled:ltr {background-image: url('/images/demoSkin/carousel-spin-left-d.png')}
af|carousel::spin-h-previous-icon-style:disabled:rtl {background-image: url('/images/demoSkin/carousel-spin-right-d.png')}
af|carousel::spin-h-next-icon-style:ltr {height: 48px; width: 22px; background-image: url('/images/demoSkin/carousel-spin-right.png'); left: 95%}
af|carousel::spin-h-next-icon-style:disabled:ltr {background-image: url('/images/demoSkin/carousel-spin-right-d.png')}
af|carousel::spin-h-next-icon-style:disabled:rtl {background-image: url('/images/demoSkin/carousel-spin-left-d.png')}
af|carousel::spin-h-thumb-icon-style {height: 48px; width: 22px; background-image: url('/images/demoSkin/carousel-spin-marker-h.png')}
af|carousel::spin-h-thumb-icon-style:disabled {background-image: url('/images/demoSkin/carousel-spin-marker-h-d.png')}
af|carousel::spin-v-previous-icon-style {height: 22px; width: 48px; background-image: url('/images/demoSkin/carousel-spin-up.png'); bottom: 95%}
af|carousel::spin-v-previous-icon-style:disabled {background-image: url('/images/demoSkin/carousel-spin-up-d.png')}
af|carousel::spin-v-next-icon-style {height: 22px; width: 48px; background-image: url('/images/demoSkin/carousel-spin-down.png'); top: 95%}
af|carousel::spin-v-next-icon-style:disabled {background-image: url('/images/demoSkin/carousel-spin-down-d.png')}
af|carousel::spin-v-thumb-icon-style:ltr {height: 22px; width: 48px; background-image: url('/images/demoSkin/carousel-spin-marker-v.png')}
af|carousel::spin-v-thumb-icon-style:rtl {height: 22px; width: 48px; background-image: url('/images/demoSkin/carousel-spin-marker-v-rtl.png')}
af|carousel::spin-v-thumb-icon-style:disabled:ltr {background-image: url('/images/demoSkin/carousel-spin-marker-v-d.png')}
af|carousel::spin-v-thumb-icon-style:disabled:rtl {background-image: url('/images/demoSkin/carousel-spin-marker-v-rtl-d.png')}
af|carousel::spin-h-previous-icon-style:small:ltr { background-image: url('/images/demoSkin/singleCard_left_ena.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-h-previous-icon-style:small:hover:ltr { background-image: url('/images/demoSkin/singleCard_left_ovr.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-h-previous-icon-style:small:active:hover:ltr { background-image: url('/images/demoSkin/singleCard_left_dwn.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-h-previous-icon-style:small:disabled:ltr { background-image: url('/images/demoSkin/singleCard_left_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-h-previous-icon-style:small:disabled:hover:ltr { background-image: url('/images/demoSkin/singleCard_left_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-h-previous-icon-style:small:disabled:active:hover:ltr { background-image: url('/images/demoSkin/singleCard_left_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-h-previous-icon-style:small:rtl { background-image: url('/images/demoSkin/singleCard_right_ena_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-h-previous-icon-style:small:hover:rtl { background-image: url('/images/demoSkin/singleCard_right_ovr_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-h-previous-icon-style:small:active:hover:rtl { background-image: url('/images/demoSkin/singleCard_right_dwn_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-h-previous-icon-style:small:disabled:rtl { background-image: url('/images/demoSkin/singleCard_right_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-h-previous-icon-style:small:disabled:hover:rtl { background-image: url('/images/demoSkin/singleCard_right_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-h-previous-icon-style:small:disabled:active:hover:rtl { background-image: url('/images/demoSkin/singleCard_right_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-h-next-icon-style:small:ltr { background-image: url('/images/demoSkin/singleCard_right_ena.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: auto; right: 0px; }
af|carousel::spin-h-next-icon-style:small:hover:ltr { background-image: url('/images/demoSkin/singleCard_right_ovr.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: auto; right: 0px; }
af|carousel::spin-h-next-icon-style:small:active:hover:ltr { background-image: url('/images/demoSkin/singleCard_right_dwn.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: auto; right: 0px; }
af|carousel::spin-h-next-icon-style:small:disabled:ltr { background-image: url('/images/demoSkin/singleCard_right_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: auto; right: 0px; }
af|carousel::spin-h-next-icon-style:small:disabled:hover:ltr { background-image: url('/images/demoSkin/singleCard_right_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: auto; right: 0px; }
af|carousel::spin-h-next-icon-style:small:disabled:active:hover:ltr { background-image: url('/images/demoSkin/singleCard_right_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: auto; right: 0px; }
af|carousel::spin-h-next-icon-style:small:rtl { background-image: url('/images/demoSkin/singleCard_left_ena_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: 0px; right: auto; }
af|carousel::spin-h-next-icon-style:small:hover:rtl { background-image: url('/images/demoSkin/singleCard_left_ovr_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: 0px; right: auto; }
af|carousel::spin-h-next-icon-style:small:active:hover:rtl { background-image: url('/images/demoSkin/singleCard_left_dwn_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: 0px; right: auto; }
af|carousel::spin-h-next-icon-style:small:disabled:rtl { background-image: url('/images/demoSkin/singleCard_left_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: 0px; right: auto; }
af|carousel::spin-h-next-icon-style:small:disabled:hover:rtl { background-image: url('/images/demoSkin/singleCard_left_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: 0px; right: auto; }
af|carousel::spin-h-next-icon-style:small:disabled:active:hover:rtl { background-image: url('/images/demoSkin/singleCard_left_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: 0px; right: auto; }
af|carousel::spin-v-previous-icon-style:small:ltr { background-image: url('/images/demoSkin/singleCard_up_ena.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-previous-icon-style:small:hover:ltr { background-image: url('/images/demoSkin/singleCard_up_ovr.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-previous-icon-style:small:active:hover:ltr { background-image: url('/images/demoSkin/singleCard_up_dwn.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-previous-icon-style:small:disabled:ltr { background-image: url('/images/demoSkin/singleCard_up_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-previous-icon-style:small:disabled:hover:ltr { background-image: url('/images/demoSkin/singleCard_up_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-previous-icon-style:small:disabled:active:hover:ltr { background-image: url('/images/demoSkin/singleCard_up_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-previous-icon-style:small:rtl { background-image: url('/images/demoSkin/singleCard_up_ena_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-previous-icon-style:small:hover:rtl { background-image: url('/images/demoSkin/singleCard_up_ovr_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-previous-icon-style:small:active:hover:rtl { background-image: url('/images/demoSkin/singleCard_up_dwn_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-previous-icon-style:small:disabled:rtl { background-image: url('/images/demoSkin/singleCard_up_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-previous-icon-style:small:disabled:hover:rtl { background-image: url('/images/demoSkin/singleCard_up_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-previous-icon-style:small:disabled:active:hover:rtl { background-image: url('/images/demoSkin/singleCard_up_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-next-icon-style:small:ltr { background-image: url('/images/demoSkin/singleCard_down_ena.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-next-icon-style:small:hover:ltr { background-image: url('/images/demoSkin/singleCard_down_ovr.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-next-icon-style:small:active:hover:ltr { background-image: url('/images/demoSkin/singleCard_down_dwn.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-next-icon-style:small:disabled:ltr { background-image: url('/images/demoSkin/singleCard_down_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-next-icon-style:small:disabled:hover:ltr { background-image: url('/images/demoSkin/singleCard_down_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-next-icon-style:small:disabled:active:hover:ltr { background-image: url('/images/demoSkin/singleCard_down_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-next-icon-style:small:rtl { background-image: url('/images/demoSkin/singleCard_down_ena_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-next-icon-style:small:hover:rtl { background-image: url('/images/demoSkin/singleCard_down_ovr_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-next-icon-style:small:active:hover:rtl { background-image: url('/images/demoSkin/singleCard_down_dwn_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-next-icon-style:small:disabled:rtl { background-image: url('/images/demoSkin/singleCard_down_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-next-icon-style:small:disabled:hover:rtl { background-image: url('/images/demoSkin/singleCard_down_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-next-icon-style:small:disabled:active:hover:rtl { background-image: url('/images/demoSkin/singleCard_down_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-h-previous-icon-style:compact:ltr { background-image: url('/images/demoSkin/singleCard_left_ena.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-h-previous-icon-style:compact:hover:ltr { background-image: url('/images/demoSkin/singleCard_left_ovr.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-h-previous-icon-style:compact:active:hover:ltr { background-image: url('/images/demoSkin/singleCard_left_dwn.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-h-previous-icon-style:compact:disabled:ltr { background-image: url('/images/demoSkin/singleCard_left_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-h-previous-icon-style:compact:disabled:hover:ltr { background-image: url('/images/demoSkin/singleCard_left_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-h-previous-icon-style:compact:disabled:active:hover:ltr { background-image: url('/images/demoSkin/singleCard_left_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-h-previous-icon-style:compact:rtl { background-image: url('/images/demoSkin/singleCard_right_ena_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-h-previous-icon-style:compact:hover:rtl { background-image: url('/images/demoSkin/singleCard_right_ovr_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-h-previous-icon-style:compact:active:hover:rtl { background-image: url('/images/demoSkin/singleCard_right_dwn_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-h-previous-icon-style:compact:disabled:rtl { background-image: url('/images/demoSkin/singleCard_right_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-h-previous-icon-style:compact:disabled:hover:rtl { background-image: url('/images/demoSkin/singleCard_right_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-h-previous-icon-style:compact:disabled:active:hover:rtl { background-image: url('/images/demoSkin/singleCard_right_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-h-next-icon-style:compact:ltr { background-image: url('/images/demoSkin/singleCard_right_ena.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: auto; right: 0px; }
af|carousel::spin-h-next-icon-style:compact:hover:ltr { background-image: url('/images/demoSkin/singleCard_right_ovr.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: auto; right: 0px; }
af|carousel::spin-h-next-icon-style:compact:active:hover:ltr { background-image: url('/images/demoSkin/singleCard_right_dwn.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: auto; right: 0px; }
af|carousel::spin-h-next-icon-style:compact:disabled:ltr { background-image: url('/images/demoSkin/singleCard_right_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: auto; right: 0px; }
af|carousel::spin-h-next-icon-style:compact:disabled:hover:ltr { background-image: url('/images/demoSkin/singleCard_right_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: auto; right: 0px; }
af|carousel::spin-h-next-icon-style:compact:disabled:active:hover:ltr { background-image: url('/images/demoSkin/singleCard_right_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: auto; right: 0px; }
af|carousel::spin-h-next-icon-style:compact:rtl { background-image: url('/images/demoSkin/singleCard_left_ena_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: 0px; right: auto; }
af|carousel::spin-h-next-icon-style:compact:hover:rtl { background-image: url('/images/demoSkin/singleCard_left_ovr_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: 0px; right: auto; }
af|carousel::spin-h-next-icon-style:compact:active:hover:rtl { background-image: url('/images/demoSkin/singleCard_left_dwn_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: 0px; right: auto; }
af|carousel::spin-h-next-icon-style:compact:disabled:rtl { background-image: url('/images/demoSkin/singleCard_left_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: 0px; right: auto; }
af|carousel::spin-h-next-icon-style:compact:disabled:hover:rtl { background-image: url('/images/demoSkin/singleCard_left_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: 0px; right: auto; }
af|carousel::spin-h-next-icon-style:compact:disabled:active:hover:rtl { background-image: url('/images/demoSkin/singleCard_left_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto;left: 0px; right: auto; }
af|carousel::spin-v-previous-icon-style:compact:ltr { background-image: url('/images/demoSkin/singleCard_up_ena.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-previous-icon-style:compact:hover:ltr { background-image: url('/images/demoSkin/singleCard_up_ovr.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-previous-icon-style:compact:active:hover:ltr { background-image: url('/images/demoSkin/singleCard_up_dwn.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-previous-icon-style:compact:disabled:ltr { background-image: url('/images/demoSkin/singleCard_up_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-previous-icon-style:compact:disabled:hover:ltr { background-image: url('/images/demoSkin/singleCard_up_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-previous-icon-style:compact:disabled:active:hover:ltr { background-image: url('/images/demoSkin/singleCard_up_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-previous-icon-style:compact:rtl { background-image: url('/images/demoSkin/singleCard_up_ena_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-previous-icon-style:compact:hover:rtl { background-image: url('/images/demoSkin/singleCard_up_ovr_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-previous-icon-style:compact:active:hover:rtl { background-image: url('/images/demoSkin/singleCard_up_dwn_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-previous-icon-style:compact:disabled:rtl { background-image: url('/images/demoSkin/singleCard_up_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-previous-icon-style:compact:disabled:hover:rtl { background-image: url('/images/demoSkin/singleCard_up_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-previous-icon-style:compact:disabled:active:hover:rtl { background-image: url('/images/demoSkin/singleCard_up_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-next-icon-style:compact:ltr { background-image: url('/images/demoSkin/singleCard_down_ena.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-next-icon-style:compact:hover:ltr { background-image: url('/images/demoSkin/singleCard_down_ovr.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-next-icon-style:compact:active:hover:ltr { background-image: url('/images/demoSkin/singleCard_down_dwn.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-next-icon-style:compact:disabled:ltr { background-image: url('/images/demoSkin/singleCard_down_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-next-icon-style:compact:disabled:hover:ltr { background-image: url('/images/demoSkin/singleCard_down_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-next-icon-style:compact:disabled:active:hover:ltr { background-image: url('/images/demoSkin/singleCard_down_dis.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: auto; right: 0px; }
af|carousel::spin-v-next-icon-style:compact:rtl { background-image: url('/images/demoSkin/singleCard_down_ena_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-next-icon-style:compact:hover:rtl { background-image: url('/images/demoSkin/singleCard_down_ovr_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-next-icon-style:compact:active:hover:rtl { background-image: url('/images/demoSkin/singleCard_down_dwn_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-next-icon-style:compact:disabled:rtl { background-image: url('/images/demoSkin/singleCard_down_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-next-icon-style:compact:disabled:hover:rtl { background-image: url('/images/demoSkin/singleCard_down_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
af|carousel::spin-v-next-icon-style:compact:disabled:active:hover:rtl { background-image: url('/images/demoSkin/singleCard_down_dis_rtl.png'); width: 27px; height: 26px; top: 0px; bottom: auto; left: 0px; right: auto; }
>
Icon Selectors
…
>
Aliases
…
>
ADF Faces Properties
…
>
Resource Styles
…
>
See Also
…
disabled
vertical
displayItems
circular
oneByOne
controlArea
full
small
compact
halign
center
start
end
valign
middle
top
bottom
H-
HX
H+
Geometry Management
Component container display mode:
Stretched
|
Flow with Width
|
Flow without Width
Print Content
Demo:OK
>
>
*
O
(//)
O
(//)
[I]
(X)
[i]
(//)
V
*
Demo:OK
Demo:Cancel
>
Demo:Loading...
