Таблицы на заказ (15)

Поделиться1Ср, 3 Окт 2012 22:19:59

Автор: rps
Стремясь к новому...
Зарегистрирован: Вс, 12 Окт 2008
Сообщений: 22652
Уважение: +4738
Позитив: +3431
Пол: Мужской
Предупреждения: ‡ 1. 2. 3. ... 10!
Последний визит:
Вс, 14 Мар 2021 21:42:57

Продолжение темы Таблицы на заказ (14).
Напомню требования:

При заказе таблиц от вас требуется:
1) Эскиз вашей будущей таблицы, сделанный в любом графическом редакторе (Пэинт, Фотошоп и т.д.) - обязательно!
2) Ссылка на ваш форум !Заказы без ссылок приниматься не будут!
3) Указать необходимые прокрутки, всплывающие окна, границы таблиц и т.п.

Заказы типа "Сделайте: Как там!" также приниматься не будут. Потрудитесь нарисовать макет таблицы самостоятельно.

И помните, чем подробнее опишите то, что нужно, тем точнее получите результат.

+3

Поделиться461Вс, 7 Июл 2013 16:39:22

Автор: МухХа
Заслуженный
Зарегистрирован: Вт, 4 Июн 2013
Сообщений: 116
Уважение: +3
Позитив: +7
Пол: Женский
Последний визит:
Пт, 15 Ноя 2013 15:57:47

Можно выделенное (Наша реклама) сменить на Баннерообмен?

Вот код:

!!!

Код:

<!-- Основная таблица -->
<table style="width: 100%; border: none;" cellpadding="0" cellspacing="0">
 <tbody>
  <tr>
   <td align="center">
<!-- Блок верхних кнопок (3шт.) -->
    <div id="menu-top">
<table style="width: 90%; border: none;" cellpadding="0" cellspacing="0">
<tr>
<td style="width: 30%;"><center><span alt="#sm1" style="cursor: pointer;">Основное</span></center></td>
<td style="width: 30%;"><center><span alt="#sm2" style="cursor: pointer;">Администрация</span></center></td>
<td style="width: 30%;"><center><span alt="#sm3" style="cursor: pointer;">Навигация</span></center></td>
</tr>
</table>
    </div>
<!-- Конец блока -->
   </td>
  </tr>
  <tr>
   <td id="MenuTxT" align="center" valign="top">
    <div id="submenu" align="center"> 
     <div id="sm1" class="submenutext" style="display:block;">
<!-- Контент первой вкладки -->
<table class="kot-pro" style="width: 100%; height: 200px; border: none;" cellpadding="0" cellspacing="4">
<tr>
<td style="width: 33%;">
<div class="obvodka">
<h3>Новости</h3>
<div class="scroll-type">

текст

</div>
</div>
</td>
<td style="width: 34%;">
<div class="obvodka">
<h3>Приветствие</h3>
<div class="scroll-type">

текст

</div>
</div>
</td>
<td style="width: 33%;">
<div class="obvodka">
<h3>Объявления</h3>
<div class="scroll-type">

текст

</div>
</div>
</td>
</tr>
</table>
<!-- Конец вкладки -->
</div>
     <div id="sm2" class="submenutext">
<!-- Контент второй вкладки -->
<table class="kot-pro" style="width: 100%; height: 200px; border: none;" cellpadding="0" cellspacing="4">
<tr>
<td style="width: 25%;">
<h3>Создатель</h3>

<img style="width: 70px; height: 90px; border: 1px solid #000;" src="http://firepic.org/images/2013-07/07/cvibwzjrip3s.png" title="Небесный"/>

</td>
<td style="width: 25%;">
<h3>Администраторы</h3>

<div id="ams_block">
<img src="http://firepic.org/images/2013-07/07/kafs091ne0yk.png" title="Тёмное Пламя"/>
<img src="ссылка на аватар" title="Река"/>
<br/>
<img src="ссылка на аватар" title="Требуется"/>
<img src="ссылка на аватар" title="Требуется"/>
</div>

</td>
<td style="width: 25%;">
<h3>Модераторы</h3>
<div class="scroll-type">
<div id="moder_block">

<img src="ссылка на аватар" title="Змеиный Яд"/>
<img src="ссылка на аватар" title="Требуется"/>
<br/>
<img src="ссылка на аватар" title="Требуется"/>
<img src="ссылка на аватар" title="Требуется"/>
<br/>
<img src="ссылка на аватар" title="Требуется"/>
<img src="ссылка на аватар" title="Требуется"/>
<br/>
<img src="ссылка на аватар" title="Требуется"/>
<img src="ссылка на аватар" title="Требуется"/>
<br/>
<img src="ссылка на аватар" title="Требуется"/>
<img src="ссылка на аватар" title="Требуется"/>
<br/>
<img src="ссылка на аватар" title="Требуется"/>

</div>
</div>
</td>
<td style="width: 25%;">
<h3>Дизайнер</h3>

<img style="width: 70px; height: 90px; border: 1px solid #000;" src="ссылка на аватар" title="имя"/>

</td>
</tr>
</table>
<!-- Конец вкладки -->
</div>
     <div id="sm3" class="submenutext">
<!-- Контент третьей вкладки -->
<table class="kot-pro" style="width: 100%; height: 200px; border: none;" cellpadding="0" cellspacing="4">
<tr>
<td style="width: 33%;">
<div class="obvodka" style="height: 186px;">
<h3>Полезные ссылки</h3>

<a href="ссылка на тему">Ссылка 1</a><br/>
<a href="ссылка на тему">Ссылка 2</a><br/>
<a href="ссылка на тему">Ссылка 3</a><br/>
<a href="ссылка на тему">Ссылка 4</a>

</div>
</td>
<td style="width: 34%;">
<div class="obvodka" style="height: 186px;">
<h3>Акции</h3>

<a href="ссылка на тему">Ссылка 1</a><br/>
<a href="ссылка на тему">Ссылка 2</a><br/>
<a href="ссылка на тему">Ссылка 3</a><br/>
<a href="ссылка на тему">Ссылка 4</a>

</div>
</td>
<td style="width: 33%;">
<div class="obvodka" style="height: 186px;">
<h3>Важно!</h3>

<a href="ссылка на тему">Ссылка 1</a><br/>
<a href="ссылка на тему">Ссылка 2</a><br/>
<a href="ссылка на тему">Ссылка 3</a><br/>
<a href="ссылка на тему">Ссылка 4</a>

</div>
</td>
</tr>
</table>
<!-- Конец вкладки -->
</div>
     <div id="sm4" class="submenutext">
<!-- Контент четвертой вкладки -->
<table class="kot-pro" style="width: 100%; height: 200px; border: none;" cellpadding="0" cellspacing="4">
<tr>
<td style="width: 60%;">
<div class="obvodka" style="height: 182px;" align="center">
<div class="scroll-type" style="height: 182px;">

Информация для пиар-агентов

</div>
</div>
</td>
<td style="width: 40%;">
<div class="obvodka">
<h3>Наша реклама</h3>
<div class="scroll-type" style="height: 115px;">

right

</div>
<hr/>

<!-- Top.Roleplay.Ru -->
<script type="text/javascript" language="javascript">
var topRPGc="<img src='http://top.roleplay.ru/cgi-bin/iv.cgi?a=ins&id=20963&rnd=" + Math.random();
topRPGc += "&r="+escape(document.referrer)+"' width='1' height='1' border='0'><a href='http://top.roleplay.ru/20963' title='Рейтинг Ролевых Ресурсов - RPG TOP' target='top_'>"+
"<img src='http://img.rpgtop.su/rpgtop1.gif' alt='Рейтинг Ролевых Ресурсов - RPG TOP' border='0' width='88' height='31'></a> ";
document.write(topRPGc);
</script>
<noscript>
<img src='http://top.roleplay.ru/cgi-bin/iv.cgi?a=ins&id=20963' width='1' height='1' border='0'><a href='http://top.roleplay.ru/20963' target='_top'><img src='http://img.rpgtop.su/rpgtop1.gif' alt='Рейтинг Ролевых Ресурсов - RPG TOP' border='0' width='88' height='31'></a>
</noscript>

</div>
</td>
</tr>
</table>
<!-- Конец вкладки -->
</div>
     <div id="sm5" class="submenutext">
<!-- Контент пятой вкладки -->
<table class="kot-pro" style="width: 100%; height: 200px; border: none;" cellpadding="0" cellspacing="4">
<tr>
<td style="width: 33%;">
<div class="obvodka">
<div class="scroll-type" style="height: 186px;">

Текст

</div>
</div>
</td>
<td style="width: 34%;">
<div class="obvodka">
<div class="scroll-type" style="height: 186px;">

Текст

</div>
</div>
</td>
<td style="width: 33%;">
<div class="obvodka" style="height: 184px; padding-top: 5px;">

Место под картинку (макс. размер: 200х180)

</div>
</td>
</tr>
</table>
<!-- Конец вкладки -->
</div>
     <div id="sm6" class="submenutext">
<!-- Контент шестой вкладки -->
<div class="obvodka">
<div class="scroll-type" style="height: 190px;">

Текст

</div>
</div>
<!-- Конец вкладки -->
</div>
     <div id="sm7" class="submenutext">
<!-- Контент седьмой вкладки -->
<table class="kot-pro" style="width: 100%; height: 200px; border: none;" cellpadding="0" cellspacing="4">
<tr>
<td style="width: 33%;">
<div class="obvodka">
<div class="scroll-type" style="height: 186px;">

Текст

</div>
</div>
</td>
<td style="width: 34%;">
<div class="obvodka">
<div class="scroll-type" style="height: 186px;">

Текст

</div>
</div>
</td>
<td style="width: 33%;">
<div class="obvodka">
<div class="scroll-type" style="height: 186px;">

Текст

</div>
</div>
</td>
</tr>
</table>
<!-- Конец вкладки -->
</div>
</div>
   </td>
</tr>
  <tr>
   <td align="center">
<!-- Блок нижних кнопок (4шт.) -->
    <div id="menu-bot">
<table style="width: 80%; border: none;" cellpadding="0" cellspacing="0">
<tr>
<td style="width: 20%;"><center><span alt="#sm4" style="cursor: pointer;">Реклама</span></center></td>
<td style="width: 20%;"><center><span alt="#sm5" style="cursor: pointer;">Погода</span></center></td>
<td style="width: 20%;"><center><span alt="#sm6" style="cursor: pointer;">Сюжет</span></center></td>
<td style="width: 20%;"><center><span alt="#sm7" style="cursor: pointer;">Дополнительно</span></center></td>
</tr>
</table>
    </div>
<!-- Конец блока -->
   </td>
  </tr>
 </tbody>
</table>
<!-- Конец основной таблицы -->

0

Поделиться462Вс, 7 Июл 2013 16:41:54

Автор: Leonheart
Заслуженный
Зарегистрирован: Пн, 8 Авг 2011
Сообщений: 1664
Уважение: +408
Позитив: +189
Пол: Мужской
Последний визит:
Пн, 14 Янв 2019 12:47:55

МухХа, ну найдите заголовок "наша реклама", да перепишите..)

0

Поделиться463Вс, 7 Июл 2013 16:48:32

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51362
Уважение: +15322
Позитив: +11784
Последний визит:
Вчера 19:10:35

МухХа
:glasses: Поиск в браузере: cонтрл+F

0

Поделиться464Вс, 7 Июл 2013 16:49:59

Автор: Leonheart
Заслуженный
Зарегистрирован: Пн, 8 Авг 2011
Сообщений: 1664
Уважение: +408
Позитив: +189
Пол: Мужской
Последний визит:
Пн, 14 Янв 2019 12:47:55

Nubia написал(а):

но баннеры партнеров теперь отображаются значительно крупнее своих размеров почему то)

~~Ссылку на форум с установленной таблицей.~~

Отредактировано Rion Leonheart (Вс, 7 Июл 2013 16:52:11)

0

Поделиться465Пн, 8 Июл 2013 20:18:43

Автор: *Bur Boni*
Заслуженный
Зарегистрирован: Пн, 14 Май 2012
Сообщений: 57
Уважение: 0
Позитив: +4
Пол: Мужской
Последний визит:
Вт, 16 Сен 2014 13:20:29

Здравствуйте, мне требуется таблица для данного форума.

0

Поделиться466Пн, 8 Июл 2013 21:19:49

Автор: МухХа
Заслуженный
Зарегистрирован: Вт, 4 Июн 2013
Сообщений: 116
Уважение: +3
Позитив: +7
Пол: Женский
Последний визит:
Пт, 15 Ноя 2013 15:57:47

http://cwtt.5bb.ru/
Всё указано на картинке

0

Поделиться467Пн, 8 Июл 2013 22:51:47

Автор: ЛаскаКВ
Заслуженный
Зарегистрирован: Сб, 1 Июн 2013
Сообщений: 282
Уважение: +34
Позитив: +36
Последний визит:
Чт, 5 Янв 2017 15:45:43

насчет моего изаказа..ВВерху там все описано)) Ну я нашла фон-
веточки не нужны

0

Поделиться468Пт, 12 Июл 2013 03:15:14

Автор: Leonheart
Заслуженный
Зарегистрирован: Пн, 8 Авг 2011
Сообщений: 1664
Уважение: +408
Позитив: +189
Пол: Мужской
Последний визит:
Пн, 14 Янв 2019 12:47:55

*Bur Boni*, здравствуйте.
Верхний ряд - это кнопки, если я правильно понимаю: таблица с переменным контентом при нажатии на одну из них? Если это так - то остальные две вкладки - просто пустые?

0

Поделиться469Пт, 12 Июл 2013 03:20:31

Автор: Leonheart
Заслуженный
Зарегистрирован: Пн, 8 Авг 2011
Сообщений: 1664
Уважение: +408
Позитив: +189
Пол: Мужской
Последний визит:
Пн, 14 Янв 2019 12:47:55

МухХа: моно ли поменять размер таблицы? Ибо мы будем менять дизайн!
Ответ: да вы и таблицу заодно решили сменить ) но проще сделать резиновую... она сама подстраивается под размер форума... но посмотрим.

Я пока в низкой активности... так что как будет время, только тогда сделаю.

0

Поделиться470Сб, 13 Июл 2013 15:02:32

Автор: *Bur Boni*
Заслуженный
Зарегистрирован: Пн, 14 Май 2012
Сообщений: 57
Уважение: 0
Позитив: +4
Пол: Мужской
Последний визит:
Вт, 16 Сен 2014 13:20:29

Rion Leonheart
Да, вы правы)

0

Поделиться471Вс, 14 Июл 2013 07:17:02

Автор: Leonheart
Заслуженный
Зарегистрирован: Пн, 8 Авг 2011
Сообщений: 1664
Уважение: +408
Позитив: +189
Пол: Мужской
Последний визит:
Пн, 14 Янв 2019 12:47:55

Abaddon,

Показать код

в html-верх:

Код:

<style type="text/css">
/* Настройки таблицы объявления */
#my_tab_st td {
  text-align: center;
  vertical-align: top;
  }

#my_tab_st h3 {
  margin: 2px 0 5px 0;
  font: bold italic 16px 'palatino linotype', serif;
  letter-spacing: 1px;
  }

.img_board img {
  width: 40px;
  height: 40px;
  outline: 1px solid #000;
  }

#links_style a {
  display: block;
  margin-bottom: 4px;
  letter-spacing: 1px;
  }
</style>

В объявление:

Код:

<!-- Основная таблица --><table id="my_tab_st" style="width: 100%; border: none;" cellspacing="0" cellpadding="0">
<tr>
<td style="width: 40%;" rowspan="2">
<h3>Объявления и новости</h3>
<div style="width: 99%; height: 150px; overflow-y: auto;">
<!-- Блок новостей -->

текст

<!-- Конец блока -->
</div>
<h3>Погода и события</h3>
<div style="width: 99%; height: 110px; overflow-y: auto;">
<!-- Блок погоды -->

текст

<!-- Конец блока -->
</div>
<h3>Баннеры</h3>
<div style="width: 99%; height: 66px; overflow-y: auto; ">
<!-- Блок баннеров -->

(место под кнопки баннеров)

<!-- Конец блока -->
</div>
</td>
<td style="width: 30%;">
<h3>Администраторы</h3>
<!-- Вложенная таблица АМС -->
<center><table class="img_board" style="width: 60%; border: none;" cellspacing="0" cellpadding="0">
<tr>
<td style="width: 30%;"><img src="http://pic.ru/"></td>
<td style="width: 30%;"><img src="http://pic.ru/"></td>
</tr>
<tr>
<td>Nik_1</td>
<td>Nik_2</td>
</tr>
<tr>
<td><img src="http://pic.ru/"></td>
<td><img src="http://pic.ru/"></td>
</tr>
<tr>
<td>Nik_3</td>
<td>Nik_4</td>
</tr>
</table></center>
<!-- Конец таблицы -->
<h3>Модераторы</h3>
<!-- Вложенная таблица модераторов -->
<center><table class="img_board" style="width: 60%; border: none;" cellspacing="0" cellpadding="0">
<tr>
<td style="width: 30%;"><img src="http://pic.ru/"></td>
<td style="width: 30%;"><img src="http://pic.ru/"></td>
</tr>
<tr>
<td>Nik_1</td>
<td>Nik_2</td>
</tr>
<tr>
<td><img src="http://pic.ru/"></td>
<td><img src="http://pic.ru/"></td>
</tr>
<tr>
<td>Nik_3</td>
<td>Nik_4</td>
</tr>
</table></center>
<!-- Конец таблицы -->
</td>
<td style="width: 30%;">
<h3>Полезные ссылки</h3>
<div id="links_style" style="width: 99%; height: 220px; margin-bottom: 5px; overflow-y: auto;">
<!-- Блок ссылок -->
<a href="сслыка на тему">Ссылка_1</a>
<a href="сслыка на тему">Ссылка_2</a>
<a href="сслыка на тему">Ссылка_3</a>
<a href="сслыка на тему">Ссылка_4</a>
<a href="сслыка на тему">Ссылка_5</a>
<!-- Конец блока -->
</div>
<!-- Выпадающая доп. навигация -->
<form> 
<select name="select" class="forminput" onchange="location.href=(form.select.options[form.select.selectedIndex].value)"> 
<option>Навигация</option> 
<option value="ссылка">Тема_1</option>
<option value="ссылка">Тема_2</option>
<option value="ссылка">Тема_3</option>
<option value="ссылка">Тема_4</option>
<option value="ссылка">Тема_5</option>
</select> 
</form>
<!-- Конец дополнения -->
</td>
</tr>
<tr>
<td>
<h3>Лучшие</h3>
<!-- Вложенная таблица лучших -->
<center><table class="img_board" style="width: 60%; border: none;" cellspacing="0" cellpadding="0">
<tr>
<td style="width: 30%;"><img src="http://pic.ru/"></td>
<td style="width: 30%;"><img src="http://pic.ru/"></td>
</tr>
<tr>
<td>Nik_1</td>
<td>Nik_2</td>
</tr>
<tr>
<td><img src="http://pic.ru/"></td>
<td><img src="http://pic.ru/"></td>
</tr>
<tr>
<td>Nik_3</td>
<td>Nik_4</td>
</tr>
</table></center>
<!-- Конец таблицы -->
</td>
<td>
<h3>5 вечеров с...</h3>
<!-- Блок "жертвы" для допросов -->

<img style="width: 70px; height: 70px; outline: 1px solid #000;" src="http://pic.ru/">

<h3>(Имя игрока)</h3>
<!-- Конец блока -->
</td>
</tr>
</table><!-- Конец основной таблицы -->

+1

Поделиться472Вс, 14 Июл 2013 16:01:52

Автор: Abaddon
Стремящийся
Зарегистрирован: Сб, 6 Июл 2013
Сообщений: 3
Уважение: 0
Позитив: 0
Последний визит:
Пн, 5 Авг 2013 21:59:11

Rion Leonheart
Спасибо большое)

0

Поделиться473Вс, 14 Июл 2013 21:43:53

Автор: ЛаскаКВ
Заслуженный
Зарегистрирован: Сб, 1 Июн 2013
Сообщений: 282
Уважение: +34
Позитив: +36
Последний визит:
Чт, 5 Янв 2017 15:45:43

мой заказ активен!!! :glasses:

0

Поделиться474Ср, 17 Июл 2013 18:23:30

Автор: Leonheart
Заслуженный
Зарегистрирован: Пн, 8 Авг 2011
Сообщений: 1664
Уважение: +408
Позитив: +189
Пол: Мужской
Последний визит:
Пн, 14 Янв 2019 12:47:55

ЛаскаКВ написал(а):

мой заказ активен!!

Я про вас помню.

Код таблицы

В html-верх:

Код:

<style type="text/css">
/* Настройки таблицы в объявлении */
#pun-announcement h2 {display: none}
#pun-announcement .container {padding-top: 1em;}

#Kw_f td {
  text-align: center;
  vertical-align: top;
  }

#Kw_f h3 {
  margin: 1px 0 4px 0;
  font: normal 16px 'comic sans ms';
  }

#Kw_f hr {
  border: none;
  border-top: 1px dashed black;
  margin: 1em auto;
  width: 86%;
  height: 1px;
  }

#menu {margin: 0px;}

#menu span {
  display: block;
  padding: 5px;
  margin: 0px;
  font: normal 16px 'comic sans ms';
  }

#menu span:hover {color: #000;}

#menu .tabactive {
  color: #4C8908;
  text-decoration: underline;
  }

#submenu {
  padding: 5px;
  width: 400px;
  }

.submenutext {
  display: none;
  text-align: center;
  height: 170px;
  background-color: #D6CDB3;
  }
</style>

В объявление:

Код:

<center><table id="Kw_f" style="width: 700px; height: 300px; background: transparent url(http://s5.uploads.ru/kEZpI.jpg) 0 0 no-repeat; border: none;" cellspacing="0" cellpadding="0">
<tr>
<td style="width: 40%;" rowspan="2">

<h3>Новости</h3>
<div style="width: 92%; height: 235px; margin: 2px auto; overflow-y: auto;">

(первый блок текста)

<hr>

(второй блок текста)

<hr>

(третий блок текста)

</div>
</td>
<td style="width: 60%;">


<table style="width: 100%; border: none; margin-top: 10px;" cellpadding="0" cellspacing="0">
 <tbody>
  <tr>
   <td>
    <div id="menu">
<table style="width: 80%; border: none;" cellpadding="0" cellspacing="0">
<tr>
<td style="width: 20%;"><span alt="#sm1" style="cursor: pointer;">Ролевая</span></td>
<td style="width: 20%;"><span alt="#sm2" style="cursor: pointer;">Летопись</span></td>
<td style="width: 20%;"><span alt="#sm3" style="cursor: pointer;">Важно</span></td>
<td style="width: 20%;"><span alt="#sm4" style="cursor: pointer;">Нужны</span></td>
</tr>
</table>
    </div>
   </td>
  </tr>
  <tr>
   <td id="MenuTxT"  align="center" valign="top">
    <div id="submenu" align="center"> 
     <div id="sm1" class="submenutext" style="display:block;">


Контент первой кнопки


</div>
     <div id="sm2" class="submenutext">


Контент второй кнопки


</div>
     <div id="sm3" class="submenutext">


Контент третьей кнопки


</div>
     <div id="sm4" class="submenutext">


Контент четвертой кнопки


</div>
</div>
   </td>
</tr>
 </tbody>
</table>


</td>
</tr>
<tr>
<td>
<div style="width: 97%; height: 62px; overflow-y: auto;">


(баннеры)


</div>
</td>
</tr>
</table></center>

В html-низ:

Код:

<!-- Спойлер-контейнер -->
<script type="text/javascript">
$(document).ready(function() {
$("td.#MenuTxT div.submenutext").hide();
<!--$(".tabs span:first").addClass("active").show(); -->
$("td.#MenuTxT div.submenutext:first").show();
$("div.#menu span").click(function() {
    $("div.#menu span").removeClass("tabactive");
    $(this).addClass("tabactive");
    $("td.#MenuTxT div.submenutext").hide();
    var activeDiv = $(this).attr("alt");
    $("div."+activeDiv).fadeIn();
    return false; });
});
</script>

+1

Поделиться475Ср, 17 Июл 2013 18:45:03

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51362
Уважение: +15322
Позитив: +11784
Последний визит:
Вчера 19:10:35

Rion Leonheart +

Я бы еще к стилю кнопок добавил красным:

#menu .tabactive {
color: #4C8908!important;
text-decoration: underline;
}
#menu span:hover {
color: #BCBC08;
text-decoration: underline;
}

Отредактировано Deff (Ср, 17 Июл 2013 18:45:56)

0

Поделиться476Ср, 17 Июл 2013 21:53:13

Автор: ЛаскаКВ
Заслуженный
Зарегистрирован: Сб, 1 Июн 2013
Сообщений: 282
Уважение: +34
Позитив: +36
Последний визит:
Чт, 5 Янв 2017 15:45:43

Rion Leonheart написал(а):

ЛаскаКВ написал(а):

мой заказ активен!!

Я про вас помню.

Код таблицы

В html-верх:

Код:

<style type="text/css">
/* Настройки таблицы в объявлении */
#pun-announcement h2 {display: none}
#pun-announcement .container {padding-top: 1em;}

#Kw_f td {
text-align: center;
vertical-align: top;
}

#Kw_f h3 {
margin: 1px 0 4px 0;
font: normal 16px 'comic sans ms';
}

#Kw_f hr {
border: none;
border-top: 1px dashed black;
margin: 1em auto;
width: 86%;
height: 1px;
}

#menu {margin: 0px;}

#menu span {
display: block;
padding: 5px;
margin: 0px;
font: normal 16px 'comic sans ms';
}

#menu span:hover {color: #000;}

#menu .tabactive {
color: #4C8908;
text-decoration: underline;
}

#submenu {
padding: 5px;
width: 400px;
}

.submenutext {
display: none;
text-align: center;
height: 170px;
background-color: #D6CDB3;
}
</style>

В объявление:

Код:

<center><table id="Kw_f" style="width: 700px; height: 300px; background: transparent url(http://s5.uploads.ru/kEZpI.jpg) 0 0 no-repeat; border: none;" cellspacing="0" cellpadding="0">
<tr>
<td style="width: 40%;" rowspan="2">

<h3>Новости</h3>
<div style="width: 92%; height: 235px; margin: 2px auto; overflow-y: auto;">

(первый блок текста)

<hr>

(второй блок текста)

<hr>

(третий блок текста)

</div>
</td>
<td style="width: 60%;">

<table style="width: 100%; border: none; margin-top: 10px;" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td>
<div id="menu">
<table style="width: 80%; border: none;" cellpadding="0" cellspacing="0">
<tr>
<td style="width: 20%;"><span alt="#sm1" style="cursor: pointer;">Ролевая</span></td>
<td style="width: 20%;"><span alt="#sm2" style="cursor: pointer;">Летопись</span></td>
<td style="width: 20%;"><span alt="#sm3" style="cursor: pointer;">Важно</span></td>
<td style="width: 20%;"><span alt="#sm4" style="cursor: pointer;">Нужны</span></td>
</tr>
</table>
</div>
</td>
</tr>
<tr>
<td id="MenuTxT" align="center" valign="top">
<div id="submenu" align="center">
<div id="sm1" class="submenutext" style="display:block;">

Контент первой кнопки

</div>
<div id="sm2" class="submenutext">

Контент второй кнопки

</div>
<div id="sm3" class="submenutext">

Контент третьей кнопки

</div>
<div id="sm4" class="submenutext">

Контент четвертой кнопки

</div>
</div>
</td>
</tr>
</tbody>
</table>

</td>
</tr>
<tr>
<td>
<div style="width: 97%; height: 62px; overflow-y: auto;">

(баннеры)

</div>
</td>
</tr>
</table></center>

В html-низ:

Код:


<script type="text/javascript">
$(document).ready(function() {
$("td.#MenuTxT div.submenutext").hide();

$("td.#MenuTxT div.submenutext:first").show();
$("div.#menu span").click(function() {
$("div.#menu span").removeClass("tabactive");
$(this).addClass("tabactive");
$("td.#MenuTxT div.submenutext").hide();
var activeDiv = $(this).attr("alt");
$("div."+activeDiv).fadeIn();
return false; });
});
</script>