S3 Slider is a simple slideshow that displays images with their description.
This is an complete rewrite to make it smaller / simpler / more elegant.
Works in IE6 + the rest.
Demo(older version, new looks similar) or download it and open index.html
Download s3-slider.js / s3-slider.css (choose minified version for production).
<div id="slider">
<div class="slide">
<img src="demo/1.jpg"/>
<span> <b>A Tile is good</b><br/>Some text long or short text should be placed here to inform customers of your great products...</span>
</div>
<div class="slide">
<img src="demo/4.jpg"/>
<span> Finally a short text...</span>
</div>
</div>
<script>
jQuery(function($){
$('#slider').s3Slider({timeout:6000,fadeTime:1000});
});
</script>
In IE6 the animation will start with a instant fade from blank->image, if you do no like this, make the first slide visible (display:block)
timeout : miliseconds or 'slow'/'fast' default: 6000
fadeTime : miliseconds or 'slow'/'fast' default: 1000
spanOpacity : opacity of description span default: 0.7
Michael Grosser
[email protected]
License: MIT
Developped By: Boban Karišik
CSS Help: Mészáros Róbert