Не знаю даже с какой стороны подобраться к данной проблеме.
Надо реализовать блок, но моих знаний явно не хватит.
Суть проблемы в нижеследующей картинке:
http://plasmon.rghost.ru/148389.image
<style>
.left li {
cursor:pointer;
list-style:none;
float:left;
margin-left:5px;
margin-right:5px;
color:#333;
}
.left li:hover {
color:#e3c7a2;
}
.block
{
margin:100px; padding:20px; border:1px solid #ccc; width:80%
}
</style>
<div class="block">
<ul class="left">
<li id="click_div_1">1</li>
<li id="click_div_2">2</li>
<li id="click_div_3">3</li>
<li id="click_div_4">4</li>
<li id="click_div_5">5</li>
</ul>
<ul class="left">
<li id="click_div_prev">назад</li>
<li id="click_div_next">вперед</li>
</ul>
<div style="clear: both;"></div>
<div id='div_1' style="display:block">текст блока 1</div>
<div id='div_2' style="display:none">текст блока 2</div>
<div id='div_3' style="display:none">текст блока 3</div>
<div id='div_4' style="display:none">текст блока 4</div>
<div id='div_5' style="display:none">текст блока 5</div>
</div>