jQuery Smooth Featured SlideShow
HTML
<style>
.nivoSlider {
position:relative;
}
.nivoSlider img {
position:absolute;
top:0px;
left:0px;
}
.nivoSlider a.nivo-imageLink {
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
border:0;
padding:0;
margin:0;
z-index:60;
display:none;
}
/* The slices in the Slider */
.nivo-slice {
display:block;
position:absolute;
z-index:50;
height:100%;
}
/* Caption styles */
.nivo-caption {
position:absolute;
left:0px;
bottom:0px;
background:#000;
color:#fff;
opacity:0.8; /* Overridden by captionOpacity setting */
width:100%;
z-index:89;
}
.nivo-caption p {
padding:5px;
margin:0;
}
.nivo-caption a {
display:inline !important;
}
.nivo-html-caption {
display:none;
}
/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav a {
position:absolute;
top:45%;
z-index:99;
cursor:pointer;
}
.nivo-prevNav {
left:0px;
}
.nivo-nextNav {
right:0px;
}
/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav a {
position:relative;
z-index:99;
cursor:pointer;
}
.nivo-controlNav a.active {
font-weight:bold;
}
table {
border-collapse:separate;
border-spacing:0;
}
caption, th, td {
text-align:left;
font-weight:normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
content:"";
}
blockquote, q {
quotes:"" "";
}
/* HTML5 tags */
header, section, footer,
aside, nav, article, figure {
display: block;
}
a, a:visited {
color:#2d3536;
text-decoration:none;
border-bottom:1px dotted #826a4d;
}
a:hover, a:active {
color:#9e805c;
text-decoration:none;
}
#slider-wrapper {
background:url(http://1.bp.blogspot.com/-4z6dtwLe9qQ/UVlJUg7wpAI/AAAAAAAAHXU/pns74YcmKtE/s1600/slider.png) no-repeat;
width:494px;
height:310px;
margin:0 auto;
padding-top:23px;
margin-top:50px;
}
#slider {
position:relative;
width:430px;
height:250px;
margin-left:32px;
background:url(http://3.bp.blogspot.com/-uMsCXhzMN30/UVk-NTGyqpI/AAAAAAAAHWM/wXjB5dtYv54/s1600/loading.gif) no-repeat 50% 50%;
}
#slider img {
...