открывашка на всякий случай
<html>
<head> <meta charset="utf-8">
<style type="text/css">
.webpart {
height: 300px;
background-color: #D3D3D3;
}
li.activated {
background-color: #1E90FF;
}
li{
float: left;
}
.content {
margin-top: 150px;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function(){
var s = $("ul.div-nav li"), b = $(".webpart");
b.toggle();
s.click(function() {
var indx = s.index(this), p = b.eq(indx);
s.not(this).removeClass("activated");
$(this).toggleClass("activated");
b.not(p).fadeOut('fast') ;
p.toggle('slow')
});
s.first().click()
});
</script>
</head>
<div id="daily-wrapper"><font color="#008000"><span style="font-size:24px">Fit Out</span></font>
<ul class="div-nav">
<li class="choice show-statys" style="width:103px;height:110px"><img alt="icon_tep.PNG" src="/sites/peo/ИС2/SiteAssets/SitePages/FitOut_Команда/icon_tep.PNG" style="border-bottom:0px;border-left:0px;margin:5px;width:80px;height:69px;border-top:0px;border-right:0px"><br>
Статус/ТЭП</li>
<li class="choice show-comanda" style="width:103px;height:110px"><img alt="icon_komanda.PNG" src="/sites/peo/ИС2/SiteAssets/SitePages/FitOut_Команда/icon_komanda.PNG" style="border-bottom:0px;border-left:0px;margin:5px;width:72px;height:66px;border-top:0px;border-right:0px"><br>
Команда проекта</li>
<li class="choice show-kv_cell" style="width:103px;height:110px"><img alt="icon_kv_cel.PNG" src="/sites/peo/ИС2/SiteAssets/SitePages/FitOut_Команда/icon_kv_cel.PNG" style="border-bottom:0px;border-left:0px;margin:5px;width:63px;height:66px;border-top:0px;border-right:0px"><br>
Квартальные цели</li>
</ul>
<div class="content">
<div class="calendar">
<h2>Calendar</h2>
<!--Статус\ТЭП-->
<div class="webpart statys" style="width: 866px;">Статус\ТЭП
<table width="100%" border="0" cellspacing="0"><tbody><tr><!--Картинка--><td valign="top" style="height: 150px; width: 186px;">
<img src="/sites/peo/%D0%98%D0%A12/css/obj/oryg.jpg" >
</td>
</tr>
</table>
</div>
<!--Команда проекта-->
<div class="webpart comanda" style="width: 866px;">Команда проекта
<table width="100%" border="0" cellspacing="0"><tbody><tr><!--Картинка--><td valign="top" style="height: 150px; width: 186px;">
<img src="/sites/peo/%D0%98%D0%A12/css/obj/oryg.jpg" >
</td>
</tr>
</table>
</div>
<!--Квартальные цели-->
<div class="webpart kv_cell" style="width: 866px;">Квартальные цели
<table width="100%" border="0" cellspacing="0"><tbody><tr><!--Картинка--><td valign="top" style="height: 150px; width: 186px;">
<img src="/sites/peo/%D0%98%D0%A12/css/obj/oryg.jpg" >
</td>
</tr>
</table>
</div>
</div>
</div>
</html>