<!--Увеличение по клику-->
<script type="text/javascript">
var usimg = document.getElementsByTagName("p");
for (i in usimg) {
if (usimg[i].className == "userimage")
usimg[i].childNodes[0].innerHTML += "<span style='display: block;'>Увеличить</span>"
}
</script>

<script src="http://code.jquery.com/jquery-latest.pack.js" type="text/javascript"></script>
<style type="text/css">
  .scrollNavi,.scrollBlock{width:400px;}
  .scrollBlock{height:100px;border:1px solid #ccc;}
  .scrollBlock .scrollItem{display:none;}
  .scrollNavi{text-align:left;}
  .scrollItem{text-align:center;}
</style>

<script type="text/javascript">
  var scrollSpeed='slow';
  var ScrollDelay= 8000; //ms
 
  doScrollNext=function(obj){
    if($(obj).parent('.scrollNavi').html()!=null){
      obj=$(obj).parent('.scrollNavi').parent('div');
    }else{
      obj=$(obj).parent().parent('.scrollNavi').parent('div');
    }
    if($(obj).find('.scrollBlock .scrollItem:visible').length!=1){
      $(obj).find('.scrollBlock .scrollItem').hide();
      $(obj).find('.scrollBlock .scrollItem:first').show();
    }
    $(obj).find('.scrollBlock .scrollItem:visible').animate({opacity:"hide"},scrollSpeed,function(){
      if($(this).html()==$(this).parent().find('.scrollItem:last').html()){
        $(this).parent().find('.scrollItem:first').animate({opacity:"show"},scrollSpeed);
      }else{
        $(this).next('.scrollItem').animate({opacity:"show"},scrollSpeed);
      }
    });
  }
 
  doScrollPrev=function(obj){
    if($(obj).parent('.scrollNavi').html()!=null){
      obj=$(obj).parent('.scrollNavi').parent('div');
    }else{
      obj=$(obj).parent().parent('.scrollNavi').parent('div');
    }
    if($(obj).find('.scrollBlock .scrollItem:visible').length!=1){
      $(obj).find('.scrollBlock .scrollItem').hide();
      $(obj).find('.scrollBlock .scrollItem:first').show();
    }
    $(obj).find('.scrollBlock .scrollItem:visible').animate({opacity:"hide"},scrollSpeed,function(){
      if($(this).html()==$(this).parent().find('.scrollItem:first').html()){
        $(this).parent().find('.scrollItem:last').animate({opacity:"show"},scrollSpeed);
      }else{
        $(this).prev('.scrollItem').animate({opacity:"show"},scrollSpeed);
      }
    });
  }

  doScroll=function(obj){
    doScrollNext(obj);
    setTimeout(function(){doScroll(obj);},ScrollDelay);
  }

  $(document).ready(function(){
    $('.scrollNext').click(function(){doScrollNext(this);});
    $('.scrollPrev').click(function(){doScrollPrev(this);});
    $('.scrollBlock .scrollItem').hide();
    $('.scrollBlock').each(function(){
      $(this).find('.scrollItem:first').show();
      var obj=$(this).parent('div').find('.scrollNext');
      setTimeout(function(){doScroll(obj);},ScrollDelay);
    });
  });
</script>

<div>
  <div class="scrollBlock">
    <div class="scrollItem">Текст 1</div>
    <div class="scrollItem">Текст 2</div>
    <div class="scrollItem">Текст 3</div>
    <div class="scrollItem">Текст 4</div>
  </div>
  <div class="scrollNavi">
    <div style="float:right;"><a href="javascript://" class="scrollNext" title="Следующий">Следующий</a></div>
    <a href="javascript://" class="scrollPrev" title="Предыдущий">Предыдущий</a>
  </div>
</div>