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

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

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Единый форум поддержки » Архив » Таблицы на заказ (15)


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

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

1

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

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

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

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

+3

981

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

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

+1

982

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

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

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

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

0

983

Лепестянка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)

+2

984

Ай нид хэлп! http://s3.uploads.ru/ErqR0.gif

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

0

985

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

Ай нид хэлп!

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


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

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

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

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

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

0

986

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

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

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

0

987

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>
<!-- Конец основной таблицы -->

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

+1

988

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

0

989

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

+

http://savepic.net/6272624.jpg

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

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

0

990

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

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

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

0

991

перезалил

0

992

повторюсь

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

0

993

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>

0

994

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>

0

995

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

0

996

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

0

997

Не актуально

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

0

998

Здравствуйте озо
1) Таблицу хочется сделать слайдами. Если возможно, то под фон текста поместить изображение.
http://sf.uploads.ru/t/q4ZU8.png
http://sf.uploads.ru/t/ca6vC.png
http://sf.uploads.ru/t/k4JiK.png
[столбцы, естественно, одинаковые, а разделяющие черты пунктирные]

http://sf.uploads.ru/t/qQnmP.png

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

0

999

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>
<!-- Конец слайдера -->

+1

1000

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

0


Вы здесь » Единый форум поддержки » Архив » Таблицы на заказ (15)