Благодарим за выбор нашего сервиса!
Тестовое сообщение
Сообщений 1 страница 2 из 2
Поделиться22015-03-29 16:40:39
<ul class="tabs">
<li class="active"><a href="#tab1">Новости</a></li>
<li class=""><a href="#tab2">Приветствие</a></li>
<li class=""><a href="#tab3">Техническое</a></li>
</ul>
<div class="tab_container1">
<div style="display: none;" id="tab2" class="tab_content">
<table border="1" cellpadding="1" cellspacing="1" style="width: 100%; height: 334px;">
<tbody>
<tr>
<td style="text-align: center;height: 17%;"><div style="height: 320px; width: 100%; overflow-y: scroll; overflow-x: hidden;">
Ребята, всем хай
<div></div></div></td>
<td style="text-align: center;height: 17%;"><div style="height: 320px; width: 100%; overflow-y: scroll; overflow-x: hidden;">
<b>Акции</b><br>
<a href="URL">1</a><br>
<a href="URL">2</a><br>
<a href="URL">3</a><br>
<div></div></div></td>
</tr>
</tbody>
</table>
</div>
<div style="display: block;" id="tab1" class="tab_content">
<table border="1" cellpadding="1" cellspacing="1" style=" width: 100%; height: 332px;">
<tbody>
<tr>
<td style="width: 50%;"><div style="height: 100%;width: 100%; overflow-y: scroll; overflow-x: hidden;">
<center><b>Сюжет<b/></center><br>
Что-то по сюжету бла-бла-бла<div></div></div></td>
<td rowspan="2" style="text-align: center;"><div style="height: 320px; width: 100%; overflow-y: scroll; overflow-x: hidden;">
<center><b>Квесты<b/></center><br>
Бла-бла-бла по квестам
<div></div></div></td>
</tr>
<tr>
<td style="text-align: center;"><div style="height: 100%; width: 100%; overflow-y: scroll; overflow-x: hidden;">
Даже я уже не помню зачем нужна эта маленькая хрень. Потом придумаю.
<div></div></div></td>
</tr>
</tbody>
</table>
</div>
<div style="display: none;" id="tab3" class="tab_content">
<table border="1" cellpadding="1" cellspacing="1" style="width: 100%; height: 332px;">
<tbody>
<tr>
<td colspan="3" rowspan="1" style="text-align: center;height: 17%;">Баннеры</td>
<td style="text-align: center;"><b>Логин:</b> Логин<br>
<b>Пароль:</b> 12345</td>
</tr>
<tr>
<td colspan="3" rowspan="1" style="text-align: center;height: 7%;">Навигация</td>
<td colspan="1" rowspan="2">
<p align="center">Админ-состав</p>
<p align="center"><div style="height: 248px; width: 100%; overflow-y: scroll; overflow-x: hidden;">
<center><b>Администрация</b></center><br>
</div></p>
</td>
</tr>
<tr>
<td colspan="2" style="text-align: center;"><a href="URL">1</a><br>
<a href="URL">2</a><br>
<a href="URL">3</a><br>
<a href="URL">4</a><br>
<a href="URL">5</a><br></td>
<td style="text-align: center;"><a href="URL">1</a><br>
<a href="URL">2</a><br>
<a href="URL">3</a><br>
<a href="URL">4</a><br>
<a href="URL">5</a><br></td>
</tr>
</tbody>
</table>
</div>
</div>
<style>
.container1 {width: 900px; margin: 0 auto; padding: 0;}
ul.tabs {
margin: 0;
padding: 0;
float: left;
list-style: none;
height: 40px;
width: 100%;
}
ul.tabs li {
float: left;
margin: 0;
padding: 0;
height: 38px;
line-height: 40px;
overflow: hidden;
position: relative;
border: 1px solid black;
margin-left: 140px;
}
ul.tabs li a {
text-decoration: none;
color: black;
display: block;
padding: 0 5px;
outline: none;
}
ul.tabs li a:hover {
background: url();
border-bottom: 0px solid #000000;
border-top: 0px solid #000000;
border-left: 0px solid #000000;
border-right: 0px solid #000000;
}
html ul.tabs li.active {
background: transparent;
box-shadow: 0px 0px 1px black;
}
html ul.tabs li.active a:hover {
background: transparent;
}
.tab_container1 {
clear: both;
float: left;
width: 840px;
height: 343px;
background: transparent;
box-shadow: 0 0 6px rgba(0, 0, 0, 0.6);
-khtml-border-radiua: 4px;
-moz-border-radius: 4px;
-khtml-border-radius: 4px;
-webkit-border-radius: 4px;
}
.tab_content {
padding: 5px;
}
.tab_content h2 {
font-weight: normal;
padding-bottom: 2px;
border-bottom: 0px dashed #000000;
}
</style>
<script type="text/javascript">
$(document).ready(function(){
$('.splLink').click(function(){
$(this).parent().children('div.splCont').toggle('normal');
return false;
});
});
</script>
<script type="text/javascript">
$(document).ready(function() {
$(".tab_content").hide();
$("ul.tabs li:first").addClass("active").show();
$(".tab_content:first").show();
$("ul.tabs li").click(function() {
$("ul.tabs li").removeClass("active");
$(this).addClass("active");
$(".tab_content").hide();
var activeTab = $(this).find("a").attr("href");
$(activeTab).fadeIn();
return false;
});
});
</script>