The layout is to define size, and arrange accessories like Loading Screen, Bullet Navigator, Arrow Navigator and Thumbnail Navigator of a slider.
Outer Container is the main container which represents the whole slider, it contains Slides Container. And Slides Container contains all slides.
Optionally, you can insert Loading Screen into Outer Container. The Loading Screen will display while images of a slide are loading.
Optionally, you can insert Bullet Navigator, Arrow Navigator and Thumbnail Navigator into Outer Container.
By default, Slides Container size is equal to slide size. It can be set to larger than slide size explicitely, thus there is chance to display multiple columns of slides in the Slides Container.
By default, Outer Container size is equal to Slides Container size. It can be set to larger than Slides Container size explicitely, thus there is chance to put navigators aside by the Slides Container.
Click 'Layout' menu to open layout window.
Slide width and height are key layout options, all other options are optional.
Number of slides to fill in Slides Container.
Spacing (in pixel) between slides.
Offset position (in pixel) to align current slide in Slides Container, if this option is not specified, current slide will align to center of Slides Container.
Note that this option works only in case of slideshow disabled.
Orientation to arrange slides, default value is 'horizontal'.
This option also indicates 'orientaiton' to play (if 'Auto Play' is enabled).
The way to fill main image in each slide, default value is 'stretch'.
'stretch': stretch main image to fill full area of slide.
'contain': scale main image and put it all inside at center of slide area.
'cover': scale main image and let it cover full area of slide.
'actual size': keep original size of main image and put it at center of slide area.
'contain for large image and actual size for small image': use 'contain' for large image and 'actual size' for small image.
Positioning Slides Container in Outer Container.
Skin in html format which will display on top of slide while images of the slide are loading.
If this option is enabled, the slider will keep resizing to fit target size while window resizing.
Scale To: Specifies the way to scale the slider while window resizing.
Max Width: Specifies width limit to prevent slider from scaling too large.
Max Height: Specifies height limit to prevent slider from scaling too large.
Switch to 'Bullets', 'Arrows' and 'Thumbnails' tabs, you can enable/disable bullet navigator, arrow navigator and thumbnail navigator.