<div class="slider" oncontextmenu="return false">  
<div class="spages"><div onclick="slider('eq(0)',this)" style="cursor:default;opacity:0.7">×</div></div>  
<div class="stitle"><div></div><div class="spodtitle"></div></div>  
<!-- Вводим картинки, которые будут в слайдере. В title пишем заголовок, в alt - подзаголовок, в url - ссылку на картинку, а в href - ссылку куда будет сделан переход при клике -->  

<a href="/"><img src="url" title="Заголовок 1" alt="Подзаголовок 1"></a>  
<a href="/"><img src="url" title="Заголовок 2" alt="Подзаголовок 2"></a>  

<!-- Конец -->  
</div>

/* Slider by ILyeS */  
.slider{position:relative;width:600px;height:300px;background:#bbb;cursor:pointer;border:1px solid #000}  
.spages{position:absolute;left:8px;top:10px}  
.spages div{float:left;margin:0 2px;background:#222;width:25px;height:10px;border:1px solid #fff;border-radius:2px;opacity:0.3;text-align:center;color:#fff;font-size:7pt}  
.spages div:hover{opacity:0.5}  
.stitle{position:absolute;left:0;bottom:0;right:0;height:60px;background:#333;opacity:0.7;padding:10px;color:#fff;font-weight:700;font:20pt 'Palatino Linotype';text-shadow:0 1px #000;border-top:1px solid #000;cursor:default}  
.spodtitle{font-size:12pt}  
.slider img{width:600px;height:300px;border:0}

<script>  
// Slider by ILyeS  

// Автоматическое заполнение переключателей, исходя из колличества картинок  
function sliderres(){  
a=$('.slider').html().split('<img').length-2  
if(a>0){for(i=1;i<=a;i++){$('.spages').append('<div onclick=slider("eq('+i+')",this)></div>');$('.slider img:eq('+i+')').attr("style","display:none")}}  
$('.stitle div:eq(0)').html($('.slider img:eq(0)').attr('title'));$('.stitle div:eq(1)').html($('.slider img:eq(0)').attr('alt'))  
}sliderres()  

// Переключение картинки  
function slider(a,b){  
c=$('.slider img:'+a).attr('title')  
d=$('.stitle div:eq(0)').html()  

if(c!=d){  
$('.spages div').attr("style","")  
$(b).attr("style","cursor:default;opacity:0.7")  
$('.spages div').html('')  
$(b).html('×')  

$('.stitle div:eq(0)').html(c)  
$('.stitle div:eq(1)').html($('.slider img:'+a).attr('alt'))  

$('.slider img').fadeOut(200)  
$('.stitle').hide()  
setTimeout(function(){$('.slider img:'+a).fadeIn(200)},200)  
setTimeout(function(){$('.stitle').show()},400)  
}}  
</script>