<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>  
   
  <!--[if IE 7]>  
  <style type="text/css">  
  #vtab > ul > li.selected{  
  border-right: 1px solid #fff !important;  
  }  
  #vtab > ul > li {  
  border-right: 1px solid #ddd !important;  
  }  
  #vtab > div {  
  z-index: -1 !important;  
  left:1px;  
  }  
  </style>  
  <![endif]-->  
  <style type="text/css">  
  body {  
  background: #fff;  
  font-family: verdana;  
  padding-top: 50px;  
  }  
  #vtab {  
  margin: auto;  
  width: 800px;  
  height: 100%;  
  }  
  #vtab > ul > li {  
  width: 110px;  
  height: 110px;  
  background-color: #fff !important;  
  list-style-type: none;  
  display: block;  
  text-align: center;  
  margin: auto;  
  padding-bottom: 10px;  
  border: 1px solid #fff;  
  position: relative;  
  border-right: none;  
  opacity: .3;  
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";  
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30);  
  }  
  #vtab > ul > li.home {  
  background: url('https://www.h1tan.ru/BlokTABS/bez-imeni-1.png') no-repeat center center;  
  }  
  #vtab > ul > li.login {  
  background: url('https://www.h1tan.ru/BlokTABS/bez-imeni-2.png') no-repeat center center;  
  }  
  #vtab > ul > li.support {  
  background: url('https://www.h1tan.ru/BlokTABS/bez-imeni-3.png') no-repeat center center;  
  }  
  #vtab > ul > li.selected {  
  opacity: 1;  
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";  
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);  
  border: 1px solid #ddd;  
  border-right: none;  
  z-index: 10;  
  background-color: #fafafa !important;  
  position: relative;  
  }  
  #vtab > ul {  
  float: left;  
  width: 110px;  
  text-align: left;  
  display: block;  
  margin: auto 0;  
  padding: 0;  
  position: relative;  
  top: 30px;  
  }  
  #vtab > div {  
  background-color: #fafafa;  
  margin-left: 110px;  
  border: 1px solid #ddd;  
  min-height: 500px;  
  padding: 12px;  
  position: relative;  
  z-index: 9;  
  -moz-border-radius: 20px;  
  }  
  #vtab > div > h4 {  
  color: #0b3cfe;  
  font-size: 1.2em;  
  border-bottom: 1px dotted #000;  
  padding-top: 5px;  
  margin-top: 0;  
  }  
  #loginForm label {  
  float: left;  
  width: 100px;  
  text-align: right;  
  clear: left;  
  margin-right: 15px;  
  }  
  #loginForm fieldset {  
  border: none;  
  }  
  #loginForm fieldset > div {  
  padding-top: 3px;  
  padding-bottom: 3px;  
  }  
  #loginForm #login {  
  margin-left: 115px;  
  }  
  </style>  

  <script type="text/javascript">  
  $(function() {  
  var $items = $('#vtab>ul>li');  
  $items.mouseover(function() {  
  $items.removeClass('selected');  
  $(this).addClass('selected');  

  var index = $items.index($(this));  
  $('#vtab>div').hide().eq(index).show();  
  }).eq(1).mouseover();  
  });  
  </script>  
  <div id="vtab">  
  <ul>  
  <li class="home selected"></li>  
  <li class="login"></li>  
  <li class="support"></li>  
  </ul>  
  <div>  
  <h4>  
  Скриншот #1</h4>  
  <center><img border="0" align="absmiddle" src="https://www.h1tan.ru/_ld/3/s37829205.jpg"></center>  
  </div>  
  <div>  
  <h4>  
  Скриншот #2</h4>  
  <center><img border="0" align="absmiddle" src="https://www.h1tan.ru/_ld/3/s37829205.jpg"></center>  
  </div>  
  <div>  
  <h4>  
  Скриншот #3</h4>  
  Изображения нет.  
  </div>  
  </div>