Typical usage of kGallery (dataSource: array)
JavaScript
$
(
document
)
.
ready
(
function
(
)
{
gallery
=
kGallery
(
{
wrapper
:
'#gallery-wrapper'
,
dataType
:
'array'
,
dataSource
:
[{ "large":"img1.jpg", "thumb":"img1_sml.jpg", "title":"title!" }, { "large":"img2.jpg", "thumb":"img2_sml.jpg", "title":"title2!" }]
,
startItem
:
0
}
)
;
}
)
;
HTML
<
div
id
=
"gallery-wrapper"
>
<
/
div
>
CSS
#gallery-wrapper
{
height
:
400px
;
width
:
400px
;
text-align
:
center
;
}
.kSlideshowWrapper
,
.kSlideshowItemDiv
{
width
:
400px
;
height
:
267px
;
}
.kThumbnailsInnerWrapper
{
height
:
80px
;
width
:
324px
;
}
.kThumbnailsWrapper
{
width
:
324px
;
height
:
80px
;
margin
:
10px
auto
0
auto
;
}
.kThumbnailsPage
{
width
:
324px
;
text-align
:
left
;
}
.kThumbnailsPage
img
{
padding
:
1px
;
border
:
1px
solid
black
;
margin
:
2px
;
}
.kThumbnailsPage
.selectedThumbnail
{
border-color
:
#aaaaff
;
}
.kSlideshowItemDiv
img
{
z-index
:
400
;
}