Всё о галереи sigplus (похожа на simple image), кто работал с ней? - страница 5 - Галереи

#boxplus .boxplus-background {
position:fixed;
width:100%;
height:100%;
left:0;
top:0;
background-color:black;  /* fallback for browsers that do not support rgba */
background-color:rgba(0,0,0,0.6);
cursor:default;
z-index:9999;
}

#boxplus .boxplus-dialog {
position:absolute;
min-width:100px;
min-height:100px;
left:0;
top:0;
margin:0;
border:0 solid gray;
padding:10px;
color:black;
z-index:10000;
background:transparent none no-repeat scroll center center;
}

#boxplus .boxplus-dialog div {
margin:0;
border:0 none transparent;
padding:0;
}

#boxplus .boxplus-dialog > .boxplus-title {
display:none;
position:absolute;
top:0;
}

/* Progress indicator */
#boxplus .boxplus-dialog .boxplus-progress {
position:absolute;
left:0;
right:0;
top:0;
bottom:0;
height:32px;
width:32px;
margin:auto;
background:transparent url(loading.png) no-repeat scroll 0 0;
}

/* Panels */
#boxplus .boxplus-sideways {
position:absolute;
max-width:250px;
right:10px;
top:10px;
bottom:10px;
overflow:auto;
}

#boxplus .boxplus-sideways > div {
margin:10px;
}

/* Image viewer */
#boxplus .boxplus-viewer {
direction:ltr;
position:relative;
width:600px;
height:400px;
overflow:hidden;
text-align:left;  /* overridden for body by many templates */
}

#boxplus .boxplus-viewer > div:first-child {
position:absolute;
height:100%;
width:100%;
overflow:auto;
}

#boxplus .boxplus-viewer > img {
display:block;
position:absolute;
margin:0;
border:0 none transparent;
padding:0;
width:100%;
height:100%;
transition: all 0s ease 0s;
}

#boxplus .boxplus-viewer > video {
position:absolute;
width:100%;
}

#boxplus .boxplus-viewer > div.boxplus-shockwave {
position:absolute;
width:100%;
}

/* Navigation controls in viewer */
#boxplus .boxplus-viewer > .boxplus-prev {
position:absolute;
width:57px;
left:0;
height:100%;
background:transparent none no-repeat scroll left center;
}

#boxplus .boxplus-viewer > .boxplus-prev:hover {
background:transparent url(navigation.png) no-repeat scroll -57px center;
}

#boxplus .boxplus-viewer > .boxplus-next {
position:absolute;
width:57px;
right:0;
height:100%;
background:transparent none no-repeat scroll left center;
}

#boxplus .boxplus-viewer > .boxplus-next:hover {
background:transparent url(navigation.png) no-repeat scroll 0 center;
}

/* Image resizer */
#boxplus .boxplus-viewer > .boxplus-resizer > * {
position:absolute;
top:6px;
right:6px;
width:20px;
height:20px;
background:transparent url(resize.png) no-repeat scroll 0 0;
}

#boxplus .boxplus-viewer > .boxplus-resizer > .boxplus-shrink {
background-position:0 0;
}

#boxplus .boxplus-viewer > .boxplus-resizer > .boxplus-shrink:hover {
background-position:0 -20px;
}

#boxplus .boxplus-viewer > .boxplus-resizer > .boxplus-enlarge {
background-position:-20px 0;
}

#boxplus .boxplus-viewer > .boxplus-resizer > .boxplus-enlarge:hover {
background-position:-20px -20px;
}

/* Thumbnail navigation */
#boxplus .boxplus-thumbs {
display:block;
overflow:hidden;
}

#boxplus .boxplus-viewer > .boxplus-thumbs {
position:absolute;
width:100%;
bottom:0;
}

#boxplus .boxplus-viewer > .boxplus-thumbs.boxplus-disabled {
display:block !important;
visibility:hidden !important;
}

#boxplus .boxplus-bottom > .boxplus-thumbs, #boxplus .boxplus-sideways > .boxplus-thumbs {
position:relative;
height:80px;
}

#boxplus .boxplus-thumbs {
height:80px;
}

#boxplus .boxplus-thumbs > .boxplus-rewind {
position:absolute;
width:22px;
left:0;
height:100%;
background:transparent url(buttons.png) no-repeat scroll -22px center;
}

#boxplus .boxplus-thumbs > .boxplus-forward {
position:absolute;
width:22px;
right:0;
height:100%;
background:transparent url(buttons.png) no-repeat scroll 0 center;
}

#boxplus .boxplus-thumbs > ul {
display:table-row;
position:absolute;
bottom:0;
margin:0;
border:0 none transparent;
padding:4px 0;
list-style-type:none;
list-style-image:none;
white-space:nowrap;
}

#boxplus .boxplus-viewer > .boxplus-thumbs > ul {
visibility:hidden;
}

#boxplus .boxplus-viewer > .boxplus-thumbs:hover > ul {
visibility:visible;
}

#boxplus .boxplus-thumbs > ul > li {
margin:0;
border:0 none transparent;
padding:0;
display:table-cell;
background:transparent none no-repeat scroll 0 0 !important;
text-align:center;
vertical-align:middle;
}

#boxplus .boxplus-thumbs > ul > li > img {
margin:4px;
border:1px solid gray;
padding:1px;
width:auto;
height:auto;
max-width:60px;
max-height:60px;
vertical-align:middle;
}

#boxplus .boxplus-thumbs > ul > li.boxplus-active > img,
#boxplus .boxplus-thumbs > ul > li > img:hover {
border:1px solid red !important;
}

/* Image caption */
#boxplus .boxplus-bottom > .boxplus-caption {
position:relative;
margin:5px 0 0 0;
max-height:60px;
overflow:auto;
}

#boxplus .boxplus-title {
font-weight:bold;
}

/* Navigation controls under caption */
#boxplus .boxplus-controls {
position:relative;
margin:3px 0 0 0;
}

#boxplus .boxplus-controls > div {
display:inline-block;
height:22px;
width:22px;
margin:2px;
}

#boxplus .boxplus-controls > .boxplus-hidden {
display:none;
}

#boxplus .boxplus-controls > .boxplus-prev {
background:transparent url(buttons.png) no-repeat scroll -22px 0;
}

#boxplus .boxplus-controls > .boxplus-next {
background:transparent url(buttons.png) no-repeat scroll 0 0;
}

#boxplus .boxplus-controls > .boxplus-close {
background:transparent url(buttons.png) no-repeat scroll -88px 0;
}

#boxplus .boxplus-controls > .boxplus-start {
background:transparent url(buttons.png) no-repeat scroll -110px 0;
}

#boxplus .boxplus-controls > .boxplus-stop {
background:transparent url(buttons.png) no-repeat scroll -132px 0;
}

#boxplus .boxplus-controls > .boxplus-download {
background:transparent url(buttons.png) no-repeat scroll -154px 0;
}

#boxplus .boxplus-controls > .boxplus-metadata {
background:transparent url(buttons.png) no-repeat scroll -176px 0;
}

#boxplus .boxplus-viewer > .boxplus-prev,
#boxplus .boxplus-viewer > .boxplus-next,
#boxplus .boxplus-thumbs,
#boxplus .boxplus-thumbs > ul {
background-image:url(transparent.gif);
}

#boxplus div.boxplus-left {
text-align:left;
}

#boxplus div.boxplus-center {
text-align:center;
}

#boxplus div.boxplus-right {
text-align:right;
}

#boxplus .boxplus-hidden {
visibility:hidden;
}

#boxplus .boxplus-unavailable {
display:none !important;
}

#boxplus .boxplus-disabled {
display:none !important;
}

#boxplus * {
box-sizing:content-box;
}