I am having an issue with my Supersized Slideshow jQuery plugin, which was incorporated into the template ‘shuttershot’ for wordpress. Until recently, it worked fine. Now, my background slider image will not resize to the appropriate window. I’m not sure of the issue after many Firebug tweaks and searching for answers.
Below is the CSS.
* {
margin:0;
padding:0;
}
body {
background:#111;
}
img {
border:none;
}
#supersized-loader {
position:absolute;
top:50%;
left:50%;
z-index:10;
width:60px;
height:60px;
text-indent:-999em;
background-color:#111;
background:rgba(0,0,0,0.8) url(images/progress.gif) no-repeat center center;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
margin:-30px 0 0 -30px;
}
#supersized {
position:fixed;
overflow:hidden;
z-index:-999;
height:100%;
width:100%;
}
#supersized img {
width:auto;
height:auto;
position:fixed;
display:none;
outline:none;
border:none;
}
#supersized.speed img {
-ms-interpolation-mode:nearest-neighbor;
image-rendering:0;
}
#supersized.quality img {
-ms-interpolation-mode:bicubic;
image-rendering:optimizeQuality;
}
#supersized a {
z-index:-30;
position:absolute;
overflow:hidden;
top:0;
left:0;
width:100%;
height:100%;
background:#111;
}
#supersized a.prevslide {
z-index:-20;
}
#supersized a.activeslide {
z-index:-10;
}
#supersized a.prevslide img,#supersized a.activeslide img {
display:inline;
}
#controls-wrapper {
height:62px;
width:100%;
bottom:0;
left:0;
z-index:4;
background:url(../img/nav-bg.png) repeat-x;
position:fixed;
margin:0 auto;
}
#controls {
overflow:hidden;
height:100%;
text-align:left;
z-index:5;
padding:0 114px;
}
#slidecounter {
float:left;
color:#888;
font:23px "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight:700;
text-shadow:#000 0 -1px 0;
margin:19px 10px 18px 20px;
}
#slidecaption {
overflow:hidden;
float:left;
color:#FFF;
font:16px "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight:700;
text-shadow:#000 0 2px 0;
margin:23px 20px 23px 0;
}
#navigation {
float:right;
margin:10px 20px 0 0;
}
#nextthumb,#prevthumb {
z-index:6;
display:none;
position:fixed;
bottom:12px;
height:75px;
width:100px;
overflow:hidden;
background:#ddd;
border:2px solid #fff;
-webkit-box-shadow:0 0 5px #000;
}
#nextthumb {
right:12px;
}
#prevthumb {
left:12px;
}
#nextthumb img,#prevthumb img {
width:150px;
height:auto;
}
#nextthumb:active,#prevthumb:active {
bottom:10px;
}
#navigation > :hover,#nextthumb:hover,#prevthumb:hover {
cursor:pointer;
}