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

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

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


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


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

Сообщений 221 страница 238 из 238

1

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

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

0

221

Помогите с таблицей. Я так понимаю она не сложная.
http://images.vfl.ru/ii/1474430044/dbb2763d/14194503.jpg
Параметры : 7 кнопок, 1 окно контента.
кнопки находятся над окном контента.
Таблица такая узкая, чтобы корректно отображалась на смартфоне 5д (как иначе - не знаю, резиновые таблицы, которые предлагались, все работают ужасно).
При смене контента таблица не должна прыгать и растягиваться от разных габаритов контента.
размер окна контента 400 на 400, габариты кнопок не должны вылезать за ширину 400
прокрутка должна появлятся только в случае избыточного количества текста

Отредактировано DmitryVodnik (Ср, 21 Сен 2016 23:40:03)

0

222

DmitryVodnik

Код:
<style type="text/css">
#TstTable{
 width:100%;
 padding:0;
 position:relative;
}
#TBL_Inner{
 position:relative;
 width:400px;
 margin:0 auto;
}
#TBL_buttons .btn{
 font-weight:700;
 cursor:pointer;
 margin:.2em 0;
 padding:.6em 1em;
 display:inline-block;
 border:solid 2px #999;
 border-radius:5px;
 text-align:center;
}
#TBL_buttons .btn.active {
 background:#ddd;
}
#TBL_buttons .btn:nth-child(1), 
#TBL_buttons .btn:nth-child(2), 
#TBL_buttons .btn:nth-child(3), 
#TBL_buttons .btn:nth-child(4) {
 width:172px;
}
#TBL_buttons .btn:nth-of-type(5), 
#TBL_buttons .btn:nth-of-type(6), 
#TBL_buttons .btn:nth-of-type(7) {
 width:104.5px;
}
#TBL_content {
 width:400px;
 height:400px;
 max-height:400px;
 overflow:hidden;
 border:solid 2px #999;
 border-radius:6px;
 margin:.2em 0 0 0;
}
#TBL_content .cnt{
 display:none;
 position:absolute;
 height:380px;
 width:380px;
 padding:10px;
 overflow-y:auto;
}
</style>

<div id="TstTable">
    <div id="TBL_Inner">

<div id="TBL_buttons">
    <span class="btn">Кнопка 1</span>
    <span class="btn">Кнопка 2</span>
    <span class="btn">Кнопка 3</span>
    <span class="btn">Кнопка 4</span>
    <span class="btn">Кнопка 5</span>
    <span class="btn">Кнопка 6</span>
    <span class="btn">Кнопка 7</span>
</div>

<div id="TBL_content">
    <div class="cnt">
Контент 1
    </div>
    <div class="cnt">
Контент 2
    </div>
    <div class="cnt">
Контент 3
    </div>
    <div class="cnt">
Контент 4
    </div>
    <div class="cnt">
Контент 5
    </div>
    <div class="cnt">
Контент 6
    </div>
    <div class="cnt">
Контент 7
    </div>
</div>

    </div>
</div>

<script><!--Переключение Вкладок-->
$(document).ready(function(){
  $("#TBL_content .cnt:first").show();
  $("#TBL_buttons .btn:first").addClass("active");
$("#TBL_buttons .btn").click(function(){var L=$(this).index();
$("#TBL_content .cnt").fadeOut(300).eq(L).fadeIn(300);
$("#TBL_buttons .btn").removeClass("active");
$(this).addClass("active");});});
</script>

+1

223

Alex_63, спасибо, разобрался

+1

224

Здравствуйте.

Эскиз таблицы с описанием

http://s0.uploads.ru/t/gO903.png
Слева столбиком кнопки, при нажатии на которые попадаешь на разные вкладки таблицы. При обновлении страницы открыта первая вкладка. На одном уровне с первой кнопкой - три баннера, которые зафиксированы вместе с другими кнопками и не исчезают при переключении вкладок. Под ними текст, у которого при необходимости появляется прокрутка. Текст и прокрутка находятся строго внутри поля с пунктирной границей, при прокрутке текст не должен залезать за границы или верхние баннеры. Полупрозрачное дерево на заднем фоне должно быть видно и под верхними баннерами. Размеры таблицы - 866 х 426px.

Исходники

http://s7.uploads.ru/t/dlRF1.png
http://sf.uploads.ru/t/FN14a.png
http://s4.uploads.ru/t/CO3Nm.png
http://s5.uploads.ru/t/RPm9W.png
http://sd.uploads.ru/t/4Biue.png
http://s9.uploads.ru/t/7SdRP.png
http://s3.uploads.ru/t/IkWnV.png
http://sh.uploads.ru/t/THcE0.png
http://sh.uploads.ru/t/eyZQW.png

Ссылка на форум (здесь же можно взять наполнение таблицы)

0

225

tiger_roman
Постараюсь сделать в течение недели

0

226

Что там с табличкой? С:

0

227

tiger_roman
Пока не брался... занят, мож еще через неделю (Напоминайте раз в два дня

0

228

Alex_63
Хорошо:)

0

229

#напоминаю

0

230

#напоминаю

+1

231

tiger_roman
Как-то так: (Ставить куда нужно)

Код:
<style type="text/css">
#MyTable {
  height:426px;
  width:872px;
  position:relative;
  background:url(http://s3.uploads.ru/IkWnV.png) top right no-repeat;
}
#MyTableBtns {
  float:left;
  margin-top:10px;
}
#MyTableBtns ._btn {
  margin-bottom:.8px;
  cursor:pointer;
  transition:.45s ease;
}
#MyTableBtns ._btn:hover {
  opacity:.65;
}
#MyTableCnt {
  height:336px;
  width:620px;
  margin-top:78px;
  margin-right:6px;
  float:right;
}
#MyTableCnt ._cnt {
  display:none;
  position:absolute;
  height:316px;
  width:600px;
  padding:10px;
  overflow-x:hidden;
  overflow-y:auto;
}
#MyTableLinks {
  position:absolute;
  top:0;left:230px;
  padding:22px 54px;
  width:530px;
  margin-left:10px;
  text-align:center;
}
#MyTableLinks ._gift {
  float:right;
}
</style>
 
<center><div id="MyTable">

   <!-- Ссылки сверху -->
  <div id="MyTableLinks" align=left>
    <a href="ссылка" class="_vk" style="margin-left:-350px!important;"><img src="http://sh.uploads.ru/THcE0.png" /></a>
    <a href="ссылка" class="_gift"><img src="http://sh.uploads.ru/eyZQW.png" /></a>
  </div>


  <!-- Кнопки -->
  <div id="MyTableBtns">
    <div class="_btn"><img src="http://s7.uploads.ru/dlRF1.png" /></div>
    <div class="_btn"><img src="http://sf.uploads.ru/FN14a.png" /></div>
    <div class="_btn"><img src="http://s4.uploads.ru/CO3Nm.png" /></div>
    <div class="_btn"><img src="http://s5.uploads.ru/RPm9W.png" /></div>
    <div class="_btn"><img src="http://sd.uploads.ru/4Biue.png" /></div>
    <div class="_btn"><img src="http://s9.uploads.ru/7SdRP.png" /></div>
  </div>
 
  <!-- Контент -->
  <div id="MyTableCnt">
    <div class="_cnt">
    Контент 1
    </div>
    <div class="_cnt">
    Контент 2
    </div>
    <div class="_cnt">
    Контент 3
    </div>
    <div class="_cnt">
    Контент 4
    </div>
    <div class="_cnt">
    Контент 5
    </div>
    <div class="_cnt">
    Контент 6
    </div>
  </div>
 
 
</div></center>
 
<script type="text/javascript">
$().pun_aboutReady(function() {
  $('#MyTableBtns ._btn').click(function() {
    $('._btn.active').removeClass('active');
    var index = $(this).addClass('active').index();
    $('#MyTableCnt ._cnt').fadeOut(300).eq(index).fadeIn(300);
  });
  $('#MyTableBtns ._btn').eq(0).click();
});
</script>

Контент ставите свой, Вертикальная Прокрутка в ячейках имеется

Демо > http://hostjs.mybb.ru/pages/table_tiger_roman

+1

232

Alex_63
Большое спасибо!
Установил без особых проблем.

+1

233

1) http://funkyimg.com/i/2iJ4D.png - сам низ с таблицей
http://funkyimg.com/i/2iJ5h.png - скрин с описанием
Нужна ли отдельно табличка в пнг-формате?
2) http://smsc.rolka.su/
3) В окошке "Партнеры" нужна прокрутка, как в таблице наверху. И можно ли скрипт затемнения, чтобы при наведении на окно , баннера подсвечивались.
Пример здесь - http://imagiart.ru/ внизу.
Где "из сюжетных хроник" чуть ниже также нужна прокрутка потому, что там пойдет сплошной текст. Само окно длиной до конца окна с партнерами и без рамок. Ширина не так важна, лишь бы отступ от тела форума был такой же, как и показано слева.
В сюжетных хрониках будут цитаты. Как прописать в таблице, чтобы они при обновлении страницы каждый раз менялись?

Отредактировано Ms. Juliet (Ср, 26 Окт 2016 11:05:59)

0

234

Ms. Juliet написал(а):

Нужна ли отдельно табличка в пнг-формате?

Лучше да...

Ms. Juliet написал(а):

Как прописать в таблице, чтобы они при обновлении страницы каждый раз менялись?

Есть скрипт Ротатор произвольного контента - Поищите здесь по форуму

0

235

Alex_63
http://funkyimg.com/i/2iKyF.png - держите табличку :3
А скрипт поищу, спасибо)

0

236

Ms. Juliet
Оки, мож сваяю в течение недели (или дольше... но не обещаю, ибо работы много, а времени не всегда хватает

0

237

Alex_63
Хорошо, я буду ждать **

0

238

Тема Закрыта, в связи с ограничениями по времени присутсвия помогающих
Текущие запросы будут обработаны!

+2


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