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

Страница: « 1 … 48 49 50

Сообщений 981 страница 1000 из 1000

Поделиться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) Указать необходимые прокрутки, всплывающие окна, границы таблиц и т.п.

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

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

Поделиться981Сб, 6 Дек 2014 15:54:42

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

Deff, приветы 8-)

Надо будет потестить на досуге...

Поделиться982Сб, 6 Дек 2014 17:28:04

Автор: Лепестянка001
Заслуженный
Зарегистрирован: Вт, 4 Ноя 2014
Сообщений: 21
Уважение: 0
Позитив: 0
Последний визит:
Чт, 17 Сен 2015 17:16:29

1. Скриншот
желаемая табличка

2. Форум, где будет стоять таблица
http://cwpf.rolevaya.ru/

3. Размер
ровно такой, как на картинке в пункте 1

Прокрутки и т.д. указано на картинке

Поделиться983Сб, 6 Дек 2014 21:34:25

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

Лепестянка001, держите.

Показать код

html-верх

Код:

<style type="text/css">
/* Настройки объявления */
/* Убрать слово "Объявление" */
#pun-announcement h2 {display: none}
#pun-announcement .container {padding: 0; border: 0 none transparent}

/* Настройка основной таблицы: размер, границы, цвет текста */
#my_table {
  width: 100%;
  height: 307px;
  border: 0px none transparent;
  color: #5E5641
  }

/* Настройка ячеек основной таблицы и вложенной: отступы, выравнивание */
#my_table td {
  padding: 5px;
  text-align: center;
  vertical-align: top
  }

/* Настройка заголовков: высота блока, отступы, шрифт */
#my_table td h3 {
  height: 14px;
  margin: 0 auto 10px auto;
  font: normal bold 14px 'comic sans ms'
  }

/* Настройка изображений в блоках с АМС и активом: размеры, отступ, граница */
#my_table .my_avtrs img {
  width: 50px;
  height: 50px;
  margin: 0 1em;
  border: 1px solid #000
  }

/* Цвет границы у изо при наведении */
#my_table .my_avtrs img:hover {border-color: #fff}

/* Настройка блока с кнопами: ширина, отступы */
#menu {
  width: 142px;
  margin: 65px auto 0 auto
  }

/* Настройка кнопок в обычном состоянии: отображение, высота, отступы, шрифт, цвет текста */
#menu span {
  display: block;
  height: 22px;
  padding: 3px 0 7px 0;
  margin: 0;
  margin-bottom: 10px;
  font: normal normal 22px verdana, sans-serif;
  color: #c1c1c1
  }

/* Цвет кнопок при наведении */
#menu span:hover {color: #fff}

/* Цвет кнопок в активном состоянии */
#menu span.tabactive {color: #404040}

/* Настройка контейнера с переменным содержимым: размеры, отступы */
#submenu {
  width: 478px;
  height: 276px;
  padding: 5px
  }

/* Настройка содержимого контейнера: высота, прокрутка */
.submenutext {
  display: none;
  height: 276px;
  overflow-y: auto
  }
</style>

Объявление

Код:

<!-- Основная таблица -->
<table id='my_table' cellspacing='0' cellpadding='0'>
 <tbody>
  <tr>
   <td style='padding: 0px; width: 630px; border-right: 6px solid #5e5641' rowspan='2'>
   <!-- Вложенная таблица с вкладками -->
    <table cellpadding='0' cellspacing='0'>
     <tbody>
      <tr>
       <td style='padding: 0; background-color: #5e5641'>
       <!-- Меню кнопок -->
        <div id='menu'>
         <span alt='#sm1' style='cursor: pointer'>О сайте</span>
         <span alt='#sm2' style='cursor: pointer'>Новости</span>
         <span alt='#sm3' style='cursor: pointer'>В игре</span>
         <span alt='#sm4' style='cursor: pointer; margin-bottom: 0'>Важное</span>
        </div>
       <!-- Конец меню кнопок -->
       </td>
       <td id='MenuTxT' style='padding: 0'>
        <div id='submenu'>
         <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>
   <td style='width: 304px; height: 108px; border-bottom: 6px solid #5e5641'>
    <h3>АМС</h3>
     <div class='my_avtrs'>
     <!-- Блок с амс -->
      <a href='ссылка на профиль'><img src='ссылка на аватар' title='имя'/></a>
      <a href='ссылка на профиль'><img src='ссылка на аватар' title='имя'/></a>
      <a href='ссылка на профиль'><img src='ссылка на аватар' title='имя'/></a>
     <!-- Конец блока -->
     </div>
   </td>
  </tr>
  <tr>
   <td style='height: 168px'>
    <h3>Лучшие игроки</h3>
     <div class='my_avtrs' style='height: 130px; padding: 7px 0; overflow-y: auto'>
     <!-- Блок лучших -->
      <a href='ссылка на профиль'><img src='ссылка на аватар' title='имя'/></a>
      <a href='ссылка на профиль'><img src='ссылка на аватар' title='имя'/></a>
      <a href='ссылка на профиль'><img src='ссылка на аватар' title='имя'/></a>

      <a href='ссылка на профиль'><img src='ссылка на аватар' title='имя'/></a>
      <a href='ссылка на профиль'><img src='ссылка на аватар' title='имя'/></a>
      <a href='ссылка на профиль'><img src='ссылка на аватар' title='имя'/></a>
     <!-- Конец блока -->
     </div>
   </td>
  </tr>
 </tbody>
</table>
<!-- Конец основной таблицы -->

html-низ

Код:

<!-- Скрипт переключения вкладок -->
<script type="text/javascript">
$(document).ready(function() {
$("td.#MenuTxT div.submenutext").hide();
$("#menu span:first").addClass("tabactive").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>

Отредактировано Rion Leonheart (Сб, 6 Дек 2014 21:36:53)

Поделиться984Вс, 14 Дек 2014 01:25:24

Автор: Haze
Стремящийся
Зарегистрирован: Вт, 13 Май 2014
Сообщений: 4
Уважение: 0
Позитив: 0
Последний визит:
Сб, 20 Дек 2014 20:08:00

Ай нид хэлп!

1) Эскиз вашей будущей таблицы
http://savepic.su/4535063.jpg
2) Ссылка на ваш форум
http://nenastie.rusff.ru/
3) Указать необходимые прокрутки, всплывающие окна, границы таблиц и т.п.

тык

Окно для информации, которые должно всплывать при наведении на все арты.
http://savepic.su/4541225.jpg

http://savepic.su/4542251.png - амs
http://savepic.su/4546347.png - news
http://savepic.su/4524843.png - quest
http://savepic.su/4523819.png - in game

Размеры картинок актива:
152х152
72х72
424х46

Размеры картинок амс:
60х60

Поделиться985Вт, 16 Дек 2014 15:46:31

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

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

Ай нид хэлп!

~~Амбуляция! Амбуляция!~~

Если еще актуальна заявка

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

Окно для информации, которые должно всплывать при наведении на все арты.

С какой стороны от "артов" это окно должно всплывать: сверху, снизу, слева, справа?
Недобаннеру под активными тоже присвоить "поплавок"?

~~В категорию "артов" картинки заголовков тоже входят по определению...~~

Поделиться986Вт, 16 Дек 2014 15:54:26

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51422
Уважение: +15369
Позитив: +11882
Последний визит:
Сегодня 14:56:20

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

С какой стороны от "артов" это окно должно всплывать: сверху, снизу, слева, справа?

Сверху, чуть наезжая на Арт, иначе не скопировать инфу или не тыкнуть ссылку при нужде
=> Типовые Вопросы п.п.58.

Поделиться987Ср, 17 Дек 2014 17:22:29

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

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

Сверху, чуть наезжая на Арт, иначе не скопировать инфу или не тыкнуть ссылку при нужде

Я проштудировал п.п. Совсем не то, чо хотелось...

Haze,

Мб Чип и Дейл еще успевают

html-верх:

Код:

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

/* Настройка каркаса основной таблицы */
#anima {
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0px none transparent
  }

/* Выравнивание в ячейках */
#anima td {
  text-align: center;
  vertical-align: top
  }

/* Отображение картинок-заголовков */
.tit_le {
  display: block;
  margin: 5px auto;
  padding: 0;
  border: 0px none transparent
  }

/* Отображение "плавающих" аватаров (по бокам) */
.fl_pic img {
  width: 148px;
  height: 148px;
  margin: 0;
  padding: 0;
  border: 2px dashed #000
  }

/* Отображение аватаров актива */
#active_pl img {
  width: 72px;
  height: 72px;
  margin: 3px 6px 10px 6px;
  padding: 0
  }

/* Отображение аватаров АМС */
#ams_bl img {
  width: 60px;
  height: 60px;
  margin: 0 2px;
  padding: 0
  }

.my_inf {position: relative}

.my_inf em {display: none}

/* Вид всплывающих окон */
.my_inf:hover em {
  position: absolute;
  z-index: 100;
  display: block;
  top: 0px;
  left: 0px;
  height: auto;
  max-height: 70px;
  padding: 5px;
  overflow-y: auto;
  text-align: center;
  line-height: 1em;
  font: normal 0.9em arial, tahoma, sans-serif;
  background: #dfdfdf;
  border: 3px double #3e3d39
  }

/* Выравнивание всплыв. окон у "плавающих" аватаров*/
.fl_pic em {
  margin: 10px 0 0 -2px;
  width: 140px
  }

/* Выравнивание всплыв. окон у актива */
#active_pl em {
  margin: 0 0 0 -10px;
  width: 90px
  }

/* Выравнивание всплыв. окон у АМС */
#ams_bl em {
  margin: 10px 0 0 -24px;
  width: 100px
  }
</style>

Объявление:

Код:

<!-- Основная таблица -->
<table id='anima' cellspacing='0' cellpadding='0'>
 <tbody>
  <tr>
   <td colspan='3'>
    <!-- Плавающий ав слева -->
    <div class='fl_pic' style='float: left; margin-left: 25px'><span class="my_inf"><img src='http://forumavatars.ru/img/avatars/0000/14/1c/32430-1400803147.png'/><em>Ваши комментарии</em></span></div>
    <!-- Конец -->
    <!-- Плавающий ав справа -->
    <div class='fl_pic' style='float: right; margin-right: 25px'><span class="my_inf"><img src='http://forumavatars.ru/img/avatars/0000/14/1c/32430-1400803147.png'/><em>Ваши комментарии</em></span></div>
    <!-- Конец -->
    <div id='active_pl'>
    <!-- Блок активных -->

     <span class="my_inf"><img src='http://forumavatars.ru/img/avatars/0000/14/1c/32430-1400803147.png'/><em>Ваши комментарии</em></span>
     <span class="my_inf"><img src='http://forumavatars.ru/img/avatars/0000/14/1c/32430-1400803147.png'/><em>Ваши комментарии</em></span>
     <span class="my_inf"><img src='http://forumavatars.ru/img/avatars/0000/14/1c/32430-1400803147.png'/><em>Ваши комментарии</em></span>
     <span class="my_inf"><img src='http://forumavatars.ru/img/avatars/0000/14/1c/32430-1400803147.png'/><em>Ваши комментарии</em></span>
     <span class="my_inf"><img src='http://forumavatars.ru/img/avatars/0000/14/1c/32430-1400803147.png'/><em>Ваши комментарии</em></span>

    <!-- Конец блока -->
    </div>
    <!-- "Баннер" активистов -->
    <span class="my_inf"><img style='width: 424px; height: 64px; border: 0px none transparent' src='http://forumavatars.ru/img/avatars/0000/14/1c/32430-1400803147.png'/><em style='margin: 10px 0 0 53px; width: 300px'>Ваши комментарии</em></span>
    <!-- Конец -->
   </td>
  </tr>
  <tr>
   <td colspan='3'><br/>
    <!-- Блок полезных ссылок -->
    <a href='ссылка_на_тему'>Гостевая</a> || <a href='ссылка_на_тему'>Правила</a> || <a href='ссылка_на_тему'>Сюжет</a> || <a href='ссылка_на_тему'>Акции</a> || <a href='ссылка_на_тему'>Занятые first & last name's</a> || <a href='ссылка_на_тему'>Занятые внешности</a> || <a href='ссылка_на_тему'>f.a.q.</a> || <a href='ссылка_на_тему'>День благодарения</a>
    <!-- Конец блока -->
   <br/><br/></td>
  </tr>
  <tr>
   <td style='width: 33%'>
    <img class='tit_le' src='http://savepic.su/4546347.png'/>
    <!-- Блок новостей -->

    Текст новостей

    <!-- Конец блока -->
   </td>
   <td style='width: 34%'>
    <img class='tit_le' src='http://savepic.su/4542251.png'/>
     <div id='ams_bl'>
     <!-- Блок АМС -->
     <span class="my_inf"><img src='http://forumavatars.ru/img/avatars/0000/14/1c/32430-1400803147.png'/><em>Ваши комментарии</span>
     <span class="my_inf"><img src='http://forumavatars.ru/img/avatars/0000/14/1c/32430-1400803147.png'/><em>Ваши комментарии</em></span>
     <span class="my_inf"><img src='http://forumavatars.ru/img/avatars/0000/14/1c/32430-1400803147.png'/><em>Ваши комментарии</em></span>
     <span class="my_inf"><img src='http://forumavatars.ru/img/avatars/0000/14/1c/32430-1400803147.png'/><em>Ваши комментарии</em></span>
     <!-- Конец блока -->
     </div>

    <img class='tit_le' src='http://savepic.su/4523819.png'/>
    <!-- Блок об игре -->

    Об игре

    <!-- Конец блока -->
   </td>
   <td style='width: 33%'>
    <img class='tit_le' src='http://savepic.su/4524843.png'/>
    <!-- Блок списка квестов -->

    Квесты

    <!-- Конец блока -->
   </td>
  </tr>
 </tbody>
</table>
<!-- Конец основной таблицы -->

Думаецо, куда вставлять ссылки - найдете сами.

Поделиться988Сб, 20 Дек 2014 17:11:57

Автор: Haze
Стремящийся
Зарегистрирован: Вт, 13 Май 2014
Сообщений: 4
Уважение: 0
Позитив: 0
Последний визит:
Сб, 20 Дек 2014 20:08:00

Leonheart
~~мама ама соу слоу~~
Спасибо большое : >
Всё как надо сделали : >

Поделиться989Чт, 25 Дек 2014 03:27:06

Автор: Lutz
Заслуженный
Зарегистрирован: Пт, 6 Июн 2014
Сообщений: 8
Уважение: +1
Позитив: 0
Последний визит:
Вт, 7 Ноя 2023 20:03:03

Доброго вечера х)
Честно - не очень представляю (с этим у меня в последнее время все плохо), как будет смотреться светлая или темная таблица, поэтому на ваше усмотрение.
Расположение ссылок на вкладки сверху (горизонтально) было бы очень кстати, мне нравится такой вариант.
1)

Можно добавить последнюю вкладку с парнёрством
2) http://datrivius.rusff.ru
3) Указано в шаблоне

Отредактировано Lutz (Чт, 25 Дек 2014 22:11:25)

Поделиться990Чт, 25 Дек 2014 12:08:29

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

Lutz, здравствуйте.

Администратор firepic запретил показ изображений на данном домене за нарушение правил использования фотохостинга.

Перезалейте на savepic, что ли...

Поделиться991Чт, 25 Дек 2014 22:11:39

Автор: Lutz
Заслуженный
Зарегистрирован: Пт, 6 Июн 2014
Сообщений: 8
Уважение: +1
Позитив: 0
Последний визит:
Вт, 7 Ноя 2023 20:03:03

перезалил

Поделиться992Пт, 26 Дек 2014 20:27:43

Автор: univexe
Заслуженный
Зарегистрирован: Вс, 21 Сен 2014
Сообщений: 49
Уважение: +2
Позитив: +5
Последний визит:
Чт, 29 Сен 2016 19:05:12

повторюсь

1) http://savepic.ru/5943306.jpg
2) пробник http:http://byla.rusff.ru
3) 1 - окошко под текст новостей с заголовком "Новости"
2 - навигация ссылками
3 - окошко под баннеры и три бегущие строки с остановкой при наведении
4 - кнопки перехода между вкладками
5 - полоса прокрутки для окошка новостей

Поделиться993Вс, 28 Дек 2014 01:55:48

Автор: always
Заслуженный
Зарегистрирован: Чт, 16 Июн 2011
Сообщений: 6
Уважение: 0
Позитив: 0
Последний визит:
Пт, 6 Мар 2015 16:18:50

univexe
вроде так =)

<table>
<tr>
<td><center><a target="_blank" href="ссылка"><img src="картинка кнопки 1" ></a> <a target="_blank" href="ссылка"><img src="картинка кнопки 2" ></a> <a target="_blank" href="ссылка"><img src="картинка кнопки 3" ></a> <a target="_blank" href="ссылка"><img src="картинка кнопки 4" ></a> <a target="_blank" href="ссылка"><img src="картинка кнопки 5" ></a> <a target="_blank" href="ссылка"><img src="картинка кнопки 6" ></a></center></td></tr>
<tr>
<td>
<center><span style="font-size: large;">Навигация</span><br>
<a href="адрес">название ссылки</a><br>
<a href="адрес">название ссылки</a><br>
<a href="адрес">название ссылки</a><br>
<a href="адрес">название ссылки</a><br>
<a href="адрес">название ссылки</a><br>
<a href="адрес">название ссылки</a></center>
</td>
<td>
<center><span style="font-size: large;">Новости</span><br>
текст</center>
<td>
<center><span style="font-size: large;">Баннеры</span><br>
<div style="height: ВЫСОТА ТАБЛИЦЫ С ПРОКРУТКОЙpx; width: ШИРИНАpx; position: absolute; z-index: 100; overflow-y: auto"><center><marquee onmouseover=this.stop() onmouseout=this.start() >бегущая строка</marquee><br><marquee onmouseover=this.stop() onmouseout=this.start() >бегущая строка</marquee><br><marquee onmouseover=this.stop() onmouseout=this.start() >бегущая строка</marquee></center></div>
</tr>
</table>

Поделиться994Вс, 28 Дек 2014 15:50:25

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

Lutz, времени. Ну не знаю, на скок вам придется на зуб темный вариант...

Развернуть заказ

html-верх:

Код:

<style type="text/css">
/* Стиль таблицы в объявлении
-------------------------------------------------------------- */

/* Выравнивание в ячейках таблиц */
#pun-announcement table td {
  text-align: center;
  vertical-align: top
  }

/* Меню с вкладками */
#menu {
  width: 100%;
  margin: 0 0 -1px 0;
  text-align: center
  }

/* Вид вкладки в обычном состоянии */
#menu span {
  display: inline-block;
  width: 130px;
  margin: 0 1em;
  padding: 3px 0;
  cursor: pointer;
  border-radius: 20px 20px 0 0;
  text-align: center;
  font: normal bold 1.1em tahoma, sans-serif;
  color: #BBAF7D;
  background-color: #201712
  }

/* Вид вкладки при наведении курсора */
#menu span:hover {text-shadow: 0px 0px 5px #800}

/* Вид вкладки в активном состоянии */
#menu span.tabactive {
  color: #111;
  text-shadow: 0px 0px 0px transparent;
  border-bottom: 1px solid #201712;
  background-color: #BFB691
  }

/* Вид контейнера с переменным контентом */
#submenu {
  width: 100%;
  height: auto;
  margin: 0;
  padding: 1.3% 0;
  border-radius: 20px;
  background-color: #201712;
  color: #BBAF7D
  }

.submenutext {
  display: none;
  width: 98%;
  height: 150px;
  margin: 0 auto;
  overflow-y: auto;
  text-align: center
  }

/* Вид блока со ссылками в первой вкладке */
#imp_link-box {margin: 7px 0 0 1em}

#imp_link-box a {
  display: block;
  margin-bottom: 3px;
  padding: 3px 0 4px 0;
  background-color: #BBAF7D
  }

/* Отображение картинок во второй вкладке */
#bpost-box img {
  width: 120px;
  height: 120px;
  margin: 10px 1.5em 0 1.5em;
  border: 1px solid #000
  }
</style>

Объявление:

Код:

<!-- Основная таблица -->
<table style='width: 100%; border: 0 none transparent' cellpadding='0' cellspacing='0'>
 <tbody>
  <tr>
   <td>
    <div id='menu'>
    <!-- Вкладки -->
     <span alt='#sm1'>Важное</span>
     <span alt='#sm2'>Требуются</span>
     <span alt='#sm3'>Сейчас в игре</span>
     <span alt='#sm4'>Партнёры</span>
    <!-- Конец вкладок -->
    </div>
   </td>
  </tr>
  <tr>
   <td id='MenuTxT'>
    <div id='submenu'>
     <div id='sm1' class='submenutext' style='display:block'>
     <!-- Контент Первой вкладки -->
     <!-- Вложенная Таблица -->
      <table style='width: 100%; border: 0 none transparent' cellpadding='0' cellspacing='0'>
       <tbody>
        <tr>
         <td style='width: 80%'>
          <div style='height: 150px; overflow-y: auto;'>
          <!-- Блок с кратким описание -->

           Краткое описание + игровое время

          <!-- Конец блока -->
          </div>
         </td>
         <td style='width: 20%'>
          <div id='imp_link-box'>
          <!-- Блок ссылок -->
           <a href='ссылка_на_тему'>Ссылка_1</a>
           <a href='ссылка_на_тему'>Ссылка_2</a>
           <a href='ссылка_на_тему'>Ссылка_3</a>
           <a href='ссылка_на_тему'>Ссылка_4</a>
           <a href='ссылка_на_тему'>Ссылка_5</a>
           <!-- Последняя ссылка должна быть с нулевым нижним отступом! -->
           <a href='ссылка_на_тему' style='margin-bottom: 0'>Ссылка_6</a>
          <!-- Конец блока -->
          </div>
         </td>
        </tr>
       </tbody>
      </table>
     <!-- Конец вложения -->
     <!-- Конец Первой вкладки -->
     </div>
     <div id='sm2' class='submenutext'>
     <!-- Контент Второй вкладки -->
      <div id='bpost-box'>
       <!-- Блок акций -->
       <a href='ссылка_на_акцию'><img src='ссылка_на_пикчу'/></a>
       <a href='ссылка_на_акцию'><img src='ссылка_на_пикчу'/></a>
       <a href='ссылка_на_акцию'><img src='ссылка_на_пикчу'/></a>
       <a href='ссылка_на_акцию'><img src='ссылка_на_пикчу'/></a>
       <!-- Конец блока -->
      </div>
     <!-- Конец Второй вкладки -->
     </div>
     <div id='sm3' class='submenutext'>
     <!-- Контент третьей вкладки -->
     <!-- Блок под квесты -->

      (список квестов в настоящем)

     <!-- Конец блока -->
     <!-- Конец третьей вкладки -->
     </div>
     <div id='sm4' class='submenutext'>
     <!-- Контент четвертой вкладки -->
     <!-- Заявленный блок под партнеров -->

      (баннеры партнеров)

     <!-- Конец блока -->
     <!-- Конец Четвертой вкладки -->
     </div>
    </div>
   </td>
  </tr>
 </tbody>
</table>
<!-- Конец основной таблицы -->

html-низ:

Код:

<!-- Скрипт переключения вкладок в таблице -->
<script type="text/javascript">
$(document).ready(function() {
$("td.#MenuTxT div.submenutext").hide();
$("#menu span:first").addClass("tabactive").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>

P.S.: если все ж тяготеем к полной прозрачности, то меняем html-верхнюю часть на:

Код:

<style type="text/css">
/* Стиль таблицы в объявлении
-------------------------------------------------------------- */

/* Выравнивание в ячейках таблиц */
#pun-announcement table td {
  text-align: center;
  vertical-align: top
  }

/* Меню с вкладками */
#menu {
  width: 100%;
  margin: 0 0 -1px 0;
  text-align: center
  }

/* Вид вкладки в обычном состоянии */
#menu span {
  display: inline-block;
  width: 130px;
  margin: 0 1em;
  padding: 3px 0;
  cursor: pointer;
  border-radius: 20px 20px 0 0;
  text-align: center;
  font: normal bold 1.1em tahoma, sans-serif;
  color: maroon;
  text-shadow: 1px 1px 2px #53483e
  }

/* Вид вкладки при наведении курсора */
#menu span:hover {color: #333}

/* Вид вкладки в активном состоянии */
#menu span.tabactive {
  color: #000;
  text-shadow: 0px 0px 0px transparent
  }

/* Вид контейнера с переменным контентом */
#submenu {
  width: 100%;
  height: auto;
  margin: 0;
  padding: 1.3% 0
  }

.submenutext {
  display: none;
  width: 98%;
  height: 150px;
  margin: 0 auto;
  overflow-y: auto;
  text-align: center
  }

/* Вид блока со ссылками в первой вкладке */
#imp_link-box {margin: 7px 0 0 1em}

#imp_link-box a {
  display: block;
  margin-bottom: 3px;
  padding: 3px 0 4px 0
  }

/* Отображение картинок во второй вкладке */
#bpost-box img {
  width: 120px;
  height: 120px;
  margin: 10px 1.5em 0 1.5em;
  border: 1px solid #000
  }
</style>

Поделиться995Вс, 28 Дек 2014 15:55:41

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

univexe, це вид ток первой вкладки, а остальные 5 как выглядят?

Поделиться996Вс, 28 Дек 2014 22:19:44

Автор: Lutz
Заслуженный
Зарегистрирован: Пт, 6 Июн 2014
Сообщений: 8
Уважение: +1
Позитив: 0
Последний визит:
Вт, 7 Ноя 2023 20:03:03

Leonheart
О, спасибо огромное за столь скорое выполнение заказа х))

Поделиться997Пн, 5 Янв 2015 21:39:13

Автор: Заражённый
Стремящийся
Зарегистрирован: Пт, 17 Окт 2014
Сообщений: 5
Уважение: 0
Позитив: 0
Последний визит:
Ср, 7 Янв 2015 16:43:22

Не актуально

Скрытый текст:
Для просмотра скрытого текста - войдите или зарегистрируйтесь.

Отредактировано Заражённый (Пн, 5 Янв 2015 21:44:02)

Поделиться998Ср, 7 Янв 2015 16:38:08

Автор: FForest
Заслуженный
Зарегистрирован: Вт, 30 Дек 2014
Сообщений: 9
Уважение: 0
Позитив: 0
Последний визит:
Вс, 1 Мар 2015 16:52:32

Здравствуйте озо
1) Таблицу хочется сделать слайдами. Если возможно, то под фон текста поместить изображение.

[столбцы, естественно, одинаковые, а разделяющие черты пунктирные]

2) wwwcatswars.webtalk.ru
3) Границу желательно сделать пунктиром, а края закругленными.
Стрелки направо и налево. На схеме отмечены кругом.
Заранее спасибо *о*

Поделиться999Вт, 13 Янв 2015 14:33:15

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

FForest, доброго.

Ну, вышло как нарисовали:

Развернуть

В html-верх:

Код:

<!-- Настройки слайдера -->
<link rel="stylesheet" type="text/css" href="http://forumstatic.ru/files/0010/b4/f8/71526.css" />
<script type="text/javascript" src="http://forumstatic.ru/files/0010/b4/f8/78275.js"></script>
<style>
/* Убираем верхний отступ у контейнера с объявлением */
#pun-announcement .container {padding-top: 1em}

/* Ширина и границы вложенных в слайды таблиц */
.ins-tbl {
  width: 100%;
  border: 0 none transparent
  }

/* Выравнивание в ячейках вложенных таблиц */
.ins-tbl td {
  text-align: center;
  vertical-align: top
  }

/* Заголовки во вложенных таблицах */
.ins-tbl h3 {
  margin: 2px 0 6px 0;
  font: normal bold 14px 'times new roman', serif
  }

/* Настройка для блока ссылок в первом слайде */
.ins-tbl #nav_ins a {
  display: block;
  width: 130px;
  margin: 0 auto 3px auto;
  padding: 1px 0;
  background-color: #bc8
  }

/* Ссылки при наведении (1 слайд) */
.ins-tbl #nav_ins a:hover {background-color: transparent}

/* Бордеры у блоков в первом слайде */
.ins-tbl .okantovka {
  width: 90%;
  margin: 0 auto;
  padding: 3px;
  border: 1px dashed #333;
  border-radius: 5px
  }

/* Прокрутка у блоков в первом слайде */
.ins-tbl .scrll-box {
  height: 160px;
  overflow-y: auto
  }
</style>

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

Код:

<!-- Cлайдер -->
<div id="slider2" slide-width="820" slide-height="200" class="slider" style="width:0;height:0;padding:0;border: 1px dashed #333!important;border-radius:5px">
<!-- Стрелачки -->
<img button-width="50" class="button-left hide" src="http://sf.uploads.ru/cTH35.png"/>
<img button-width="50" class="button-right" src="http://sf.uploads.ru/BojIn.png"/>
<!-- Конец стрелачек -->
 <div class="slider-content active">
  <!-- Первый слайд -->
   <table class='ins-tbl' cellspacing='0' cellpadding='0'>
    <tr><td width='25%'>
	<h3>Title</h3>
	<div id='nav_ins'>
	<!-- Блок ссылок -->

	<a href='ссылка_на_тему_1'>Ссылка_1</a>
	<a href='ссылка_на_тему_2'>Ссылка_2</a>
	<a href='ссылка_на_тему_3'>Ссылка_3</a>
	<a href='ссылка_на_тему_4'>Ссылка_4</a>
	<a href='ссылка_на_тему_5'>Ссылка_5</a>
	<a href='ссылка_на_тему_6'>Ссылка_6</a>
	<a href='ссылка_на_тему_7'>Ссылка_7</a>
	<a href='ссылка_на_тему_8'>Ссылка_8</a>

	<!-- Конец блока ссылок -->
	</div>
        </td><td width='45%'>
	<h3>Новости:</h3>
	<div class='okantovka'><div class='scrll-box'>
	<!-- Блок новостей -->

	Текст новостей

	<!-- Конец блока новостей -->
	</div></div>
	</td><td width='30%'>
	<h3>Погода:</h3>
	<div class='okantovka'><div class='scrll-box'>
	<!-- Блок погоды -->

	Текст погоды

	<!-- Конец блока погоды -->
	</div></div>
	</td></tr>
   </table>
  <!-- Конец первого слайда -->
 </div>
 <div class="slider-content">
  <!-- Второй слайд -->
   <table class='ins-tbl' height='196' cellspacing='0' cellpadding='0'>
    <tr><td width='50%' style='border-right: 1px dashed #333'>
	<h3>Администрация</h3>
	<!-- Блок АМС -->

	АМС

	<!-- Конец блока АМС -->
	</td>
	<td width='50%'>
	<h3>Самые активные игроки недели:</h3>
	<!-- Блок активных игроков -->

	Актив

	<!-- Конец блока активных игроков -->
    </td></tr>
   </table>
  <!-- Конец второго слайда -->
 </div>
 <div class="slider-content">
  <!-- Третий слайд -->
   <table class='ins-tbl' height='196' cellspacing='0' cellpadding='0'>
    <tr><td width='20%' style='border-right: 1px dashed #333'>
	<h3>Грозовое Племя</h3>

	Текст

	</td>
	<td width='20%' style='border-right: 1px dashed #333'>
	<h3>Племя Ветра</h3>

	Текст

	</td>
	<td width='20%' style='border-right: 1px dashed #333'>
	<h3>Речное Племя</h3>

	Текст

	</td>
	<td width='20%' style='border-right: 1px dashed #333'>
	<h3>Племя Теней</h3>

	Текст

	</td><td width='20%'>
	<h3>Небесное Племя</h3>

	Текст

    </td></tr>
   </table>
  <!-- Конец третьего слайда -->
 </div>
 <div class="slider-content">
  <!-- Четвертый слайд -->
   <table class='ins-tbl' height='196' cellspacing='0' cellpadding='0'>
    <tr><td width='50%' style='border-right: 1px dashed #333'>
	<h3>Квесты:</h3>
	<!-- Блок квестов -->

	Список квестов

	<!-- Конец блока квестов -->
	</td>
	<td width='50%'>
	<h3>События:</h3>
	<!-- Блок событий -->

	Список

	<!-- Конец блока событий -->
    </td></tr>
   </table>
  <!-- Конец четвертого слайда -->
 </div>
</div><script>$("#slider2").slideF(1,700);</script>
<!-- Конец слайдера -->

Поделиться1000Вт, 13 Янв 2015 16:35:51

Автор: FForest
Заслуженный
Зарегистрирован: Вт, 30 Дек 2014
Сообщений: 9
Уважение: 0
Позитив: 0
Последний визит:
Вс, 1 Мар 2015 16:52:32

Leonheart
это восхитительно! Все так, как я и хотела *о* Спасибо большое

Страница: « 1 … 48 49 50

Единый форум поддержки

Меню навигации

Пользовательские ссылки

Информация о пользователе

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

Сообщений 981 страница 1000 из 1000

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

Поделиться981Сб, 6 Дек 2014 15:54:42

Поделиться982Сб, 6 Дек 2014 17:28:04

Поделиться983Сб, 6 Дек 2014 21:34:25

Поделиться984Вс, 14 Дек 2014 01:25:24

Поделиться985Вт, 16 Дек 2014 15:46:31

Поделиться986Вт, 16 Дек 2014 15:54:26

Поделиться987Ср, 17 Дек 2014 17:22:29

Поделиться988Сб, 20 Дек 2014 17:11:57

Поделиться989Чт, 25 Дек 2014 03:27:06

Поделиться990Чт, 25 Дек 2014 12:08:29

Поделиться991Чт, 25 Дек 2014 22:11:39

Поделиться992Пт, 26 Дек 2014 20:27:43

Поделиться993Вс, 28 Дек 2014 01:55:48

Поделиться994Вс, 28 Дек 2014 15:50:25

Поделиться995Вс, 28 Дек 2014 15:55:41

Поделиться996Вс, 28 Дек 2014 22:19:44

Поделиться997Пн, 5 Янв 2015 21:39:13

Поделиться998Ср, 7 Янв 2015 16:38:08

Поделиться999Вт, 13 Янв 2015 14:33:15

Поделиться1000Вт, 13 Янв 2015 16:35:51