<script type="text/javascript" src="/js/verticaltabs.pack.js"></script>
  <link rel="stylesheet" href="/css/verticaltabs.css" />
  <script type="text/javascript">
$(document).ready(function(){  
$("#textExample").verticaltabs({speed: 500,slideShow: false,activeIndex: 2});  
$("#imageExample").verticaltabs({speed: 1000,slideShow: true,slideShowSpeed: 3000,activeIndex: 0,playPausePos: "topRight"});  
});  
  </script>

<div class="verticalslider" id="textExample">
<ul class="verticalslider_tabs">
<li><a href="#">Название первой вкладки</a></li>
<li><a href="#">Название второй вкладки</a></li>
<li><a href="#">Название третьей вкладки</a></li>
<li><a href="#">Название четвёртой вкладки</a></li>
</ul>
<ul class="verticalslider_contents">
<li>
Контент первой вкладки  
  </li>
<li>
Контент второй вкладки  
  </li>
<li>
Контент третьей вкладки  
  </li>
<li>  
Контент четвёртой вкладки  
</li>
</ul>
</div>

<div class="verticalslider" id="imageExample">
<ul class="verticalslider_tabs image">
<li><a href="#">Название первой вкладки</a></li>
<li><a href="#">Название второй вкладки</a></li>
<li><a href="#">Название третьей вкладки</a></li>
<li><a href="#">Название четвёртой вкладки</a></li>
</ul>
<ul class="verticalslider_contents">
<li><img src="Ссылка на картинку первой вкладки" /></li>
<li><img src="Ссылка на картинку второй вкладки" /></li>
<li><img src="Ссылка на картинку третьей вкладки" /></li>
<li><img src="Ссылка на картинку четвёртой вкладки" /></li>
</ul>
</div>