Очень и очень сильно извиняюсь за то, что вновь заказываю таблицу. Просто, из-за скорой смены диза, "старая" таблица станет неактуальной.
1. Ссылка на форум:
http://fmaworldsocold.rolka.su/
2. Эскиз таблицы:
Первая вкладка - http://pic.lg.ua/x/10/98b655/9d6ed242.jpg
Вторая вкладка - http://pic.lg.ua/x/15/0b3740/af288d3b.jpg
Третья вкладка - http://pic.lg.ua/x/13/0c47f1/d08572a7.jpg
Четвертая вкладка - http://pic.lg.ua/x/10/0d4016/0d8076b0.jpg
Пятая вкладка - http://pic.lg.ua/x/14/8a766a/0dcfe04d.jpg
3. Дополнительные предпочтения:
Там, где текст написан на бледно-коричневом (извините дальтоника х) ), нужно обвести границы (блок "Важно" и "Админ-состав" сделать аналогичным способом.). В остальном пожеланий нет, если будут вопросы, обязательно спрашивайте.
Еще раз извините и, заранее, огромное спасибо.
[Выполнено]Таблица. Аниме.
Сообщений 1 страница 4 из 4
Поделиться110.09.12 17:30
Поделиться211.09.12 12:28
SamTayJerome421
принято
Отредактировано Nikodima (12.11.12 23:59)
Поделиться312.09.12 11:17
SamTayJerome421
верх
<style> .container1 {width: 400px; margin: 0 auto; padding: 0;} ul.tabs { margin: 0; padding: 0; float: left; list-style: none; height: 40px; width: 400px; } ul.tabs li { float: left; margin: 0; padding: 0; height: 40px; line-height: 40px; border: 0px; margin-bottom: -2px; background: url(); overflow: hidden; position: relative; } ul.tabs li a { text-decoration: none; color: transparent; display: block; padding: 0 5px; background: url(); outline: none; } ul.tabs li a:hover { background: url(); } html ul.tabs li.active { background: url(); } html ul.tabs li.active a:hover { background: url(); } .tab_container1 { clear: both; float: left; width: 500px; height: 300px; } .tab_content { padding: 5px; } .tab_content h2 { font-weight: normal; padding-bottom: 2px; } </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>
объявление
<table width="100%" > <tr> <td ><div style=" border: 1px solid #160f0a; padding: 5px; height: 200px; "><div style="width: 100%; height: 200px; overflow-y: scroll;"> Важно </div></div></td> <td width="60%" rowspan="2"><div class="container"> <div class="html-box"> <ul class="tabs"> <li class="active"><a href="#tab1">Вкладка 1</a></li> <li><a href="#tab2">Вкладка 2</a></li> <li><a href="#tab3">Вкладка 3</a></li> <li><a href="#tab4">Вкладка 4</a></li> <li><a href="#tab5">Вкладка 5</a></li> </ul> <div class="tab_container1"> <div style="display: block;" id="tab1" class="tab_content"> <table width="100%" > <tr> <td width="60%">Приветствие</td> <td><center><div style=" border: 1px solid #160f0a; padding: 5px; height: 270px; "><div style="width: 100%; height: 270px; overflow-y: scroll;">Квесты</div></div></center></td> </tr> </table> </div> <div style="display: none;" id="tab2" class="tab_content"> <center>Текст</center><br>текст текст текст <table width="100%" > <tr> <td width="50%"><div style=" border: 1px solid #160f0a; padding: 5px; height: 220px; ">Очередь в локациях</div></td> <td><center><div style=" border: 1px solid #160f0a; padding: 5px; height: 220px; ">Текст</div></center></td> </tr> </table> </div> <div style="display: none;" id="tab3" class="tab_content"> <table width="100%" > <tr> <td width="33%"><center>Для новичков</center></td> <td width="33%"><center>Игра</center></td><td><center>Вне игры</center></td> </tr> </table> </div> <div style="display: none;" id="tab4" class="tab_content"> <table width="100%" > <tr> <td width="50%"><center><img src="картинка"></center></td> <td rowspan="2">ссылки - благодарность</td> </tr> <td width="50%"><center><div style=" border: 1px solid #160f0a; padding: 5px; height: 190px; "><div style="width: 100%; height: 190px; overflow-y: scroll;">Текст</div></div></center></td> </table> </div> <div style="display: block;" id="tab5" class="tab_content"> <center>текст текст текст<br><br> баннеры</center> </div> </div> </div> </div></td> </tr> <tr> <td rowspan="2"><div style=" border: 1px solid #160f0a; padding: 5px; height: 170px; "> Админы </div></td><tr> <td>топы</td> </tr> </table>
Поделиться412.09.12 11:27
Бу
- Огромное-приогромное спасибо!