Development
Reference - UI Definition

UI of Jssor Slider is plugable, within 'outer container', user can insert 'loading screen', 'slides container', 'navigator', 'arrow navigator', 'thumbnail navigator'.

'outer container' and 'slides container' are required, all others are optional. And also, user can insert any customize HTML code into 'outer container'.

User can insert static layer into any slide.

For position and size of element, please specify value in pixels. e.g. 'style="position: relative; top:0px; left: 0px; width:100px; height:50px;"'.

Outer Container
Property Required Value Example
id required [string] id="slider1_container"
position required absolute | relative style="position:absolute;"
width required [integer]px style="width:600px;"
height required [integer]px style="height:300px;"
Loading Screen
Property Required Value Example
u required loading u="loading"
position required absolute style="position:absolute;"
Ad
Slides Container
Property Required Value Example
required slides u="slides"
position required absolute | relative style="position:absolute;" ("absolute" recommended)
top optional [integer]px style="top:0px;"
left optional [integer]px style="left:0px;"
bottom optional [integer]px style="bottom:0px;"
right optional [integer]px style="right:0px;"
width required [integer]px style="width:300px;"
height required [integer]px style="height:30px;"
overvlow required hidden style="overflow:hidden;"
cursor optional style="cursor:move;"
Bullet Navigator
Property Required Value Example
u required navigator u="navigator"
position required absolute style="position:absolute;"
top optional [integer]px style="top:12px;"
left optional [integer]px style="left:12px;"
right optional [integer]px style="right:12px;"
bottom optional [integer]px style="bottom:12px;"
Arrow Navigator
Property Required Value Example
u required arrowleft|arrowright u="arrowleft" | u="arrowright"
position required absolute style="position:absolute;"
top optional [integer]px style="top:130px;"
left optional [integer]px style="left:8px;"
right optional [integer]px style="right:8px;"
bottom optional [integer]px style="bottom:8px;"
width required [integer]px style="width:50px;"
height required [integer]px style="heght:50px;"
Thumbnail Navigator
Property Required Value Example
u required thumbnavigator u="thumbnavigator"
position required absolute style="position:absolute;"
top optional [integer]px style="top:0px;"
left optional [integer]px style="left:0px;"
right optional [integer]px style="right:0px;"
bottom optional [integer]px style="bottom:0px;"
width required [integer]px style="width:600px;"
height required [integer]px style="heght:60px;"
Static Layer
Property Required Value Example
position required absolute style="position:absolute;"
top required [integer]px style="top:100px;"
left required [integer]px style="left:100px;"
width required [integer]px style="width:100px;"
height required [integer]px style="heght:100px;"
overflow optional hidden style="overflow:hidden;"