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

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

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


Вы здесь » Единый форум поддержки » Вопросы по оформлению форума » Общие вопросы по заказу таблиц (2)


Общие вопросы по заказу таблиц (2)

Сообщений 281 страница 297 из 297

281

Подскажите, пожалуйста, как сделать данный шрифт в таблице открывающимся

0

282

*вопрос решен и снят, извиняюсь*

Отредактировано Варя; (Пт, 21 Июл 2017 08:10:46)

0

283

Ох, все же мне нужна помощь. У меня есть вот такой код:

Код:
<style type="text/css">
div.block {
  height:200px;
  background: rgba(255, 255, 255, 0.49);
  overflow-y:auto;
  overflow-x:hidden;
}
div.Kn {
  display:inline-block;
  height:50px;
  width:145px;
   background:url(http://images.vfl.ru/ii/1500644670/62da0ad1/17993083.png) center no-repeat;
}
div.Kn:hover {
   background:url(http://images.vfl.ru/ii/1500644670/62da0ad1/17993083.png) center no-repeat;
}
div.Kn.active {
  background:url(http://images.vfl.ru/ii/1500644670/62da0ad1/17993083.png) center no-repeat;
}
.Kn-title {
  font: normal normal 400 13px/normal "Times New Roman";
  margin-top:-2px;
  margin-left:-7px;
}
div.tab {
  height:100%;
  display:none;
  overflow-y:auto;
  overflow-x:hidden;
}
</style>
    <td>
   <div class="Kn" style="margin-left: 57px;"></div>
   <div class="Kn" title="Кнопка 2"></div>
</td>
<td>
   <div class="Kn" style="margin-left: 220px;"></div>
   <div class="Kn" title="Кнопка 4"></div>
  </td>
<table cellspacing="5" style="background:url(http://images.vfl.ru/ii/1500634460/9fec10f4/17991445.png) center no-repeat;
  height:344px;
  margin-left:25px;
  width:890px;
  margin-top: -34px;
  table-layout:fixed;">
<tr valign=center align=center>
  <td width="33%">
   <div class="block" style="
    height: 80px;
    width: 220px;
    margin-top: 19px;
    margin-left: 22px;">
<!-- Контент левый верхний блок -->
   </div>
   <div class="block"  style="height:150px; width:170px; margin-top:12px">
<!-- Контент левый нижний блок -->
  </td>
  <td width="30%">
<div class="block" style="height: 80px;margin-top: 19px;">
<!-- Контент средний верхний блок -->
   </div>

   <div class="block"  style="height:150px;margin-top:12px">
<!-- Контент средний нижний блок -->
   <!-- Переключаемые Вкладки -->
 
   <div class="tab">
<!-- Контент Первой Вкладки-->
1
     </div>
        <div class="tab">
<!-- Контент Второй Вкладки-->
2
     </div>
        <div class="tab">
<!-- Контент Третьей Вкладки-->
3
     </div>
        <div class="tab">
<!-- Контент Четвертой Вкладки-->
4
     </div>
   </div>
  </td>
  <td width="33%">
   <div class="block" style="height: 80px;
    width: 220px;
    margin-top: 19px;
    margin-right: 22px;">
<!-- Контент правый верхний блок -->
   </div>
   <div class="block"  style="height:150px;  width: 170px;
    margin-top:12px">
<!-- Контент  правый нижний блок -->
  </td>
</table>
<script type="text/javascript">
$('.Kn').eq(0).addClass('active');
$('.tab').eq(0).show();   
$('.Kn').click(function(){
     $('.Kn').removeClass('active');
     $(this).addClass('active');
     var num = $('.Kn').index(this);
     $('.tab').hide().eq(num).show();
});
$('div.Kn').tipsy({fade: true, gravity: 'e Kn-title'}); 
</script>


Мне нужно из верхнего сделать нижний результат ( выровнять ширину ячеек как на нижнем скрине). У меня это не получается, все едет куда-то, не хочет нормально выпрямляться(

http://s6.uploads.ru/Gb8si.png

http://filice.mybb.ru/

0

284

Варя;, примерно так:

Код:
<table cellspacing="5" style="background:url(http://images.vfl.ru/ii/1500634460/9fec10f4/17991445.png) center no-repeat;
  height:344px;
  margin-left:25px;
  width:890px;
  margin-top: -34px;
  table-layout:fixed;">
<tr valign=bottom align=center>
  <td>
   <div class="block" style="display: inline-block;
    height: 80px;
    width: 220px;
    margin-top: 20px;
    margin-left: 45px;">
<!-- Контент левый верхний блок -->
   </div>

   <div class="block" style="display: inline-block; height: 80px; width: 340px; margin-top: 20px;">
<!-- Контент средний верхний блок -->
   </div>
   <div class="block" style="display: inline-block;
    height: 80px;
    width: 220px;
    margin-top: 20px;
    margin-right: 45px;">
<!-- Контент правый верхний блок -->
   </div>
  </td>
</tr>
<tr valign=top align=center>
  <td>
   <div class="block"  style="display: inline-block; height:150px; width:170px; margin-left: 45px;">
<!-- Контент левый нижний блок -->
   </div>
   <div class="block"  style="display: inline-block; height:150px; width: 440px;">
<!-- Контент средний нижний блок -->
   <!-- Переключаемые Вкладки -->
 
   <div class="tab">
<!-- Контент Первой Вкладки-->
1
     </div>
        <div class="tab">
<!-- Контент Второй Вкладки-->
2
     </div>
        <div class="tab">
<!-- Контент Третьей Вкладки-->
3
     </div>
        <div class="tab">
<!-- Контент Четвертой Вкладки-->
4
     </div>
   </div>
   <div class="block"  style="display: inline-block; height:150px;  width: 170px; margin-right: 45px;">
<!-- Контент  правый нижний блок -->
   </div>
  </td>
</tr>
</table>

Собственно, табличка. Остальное без изменений.

+1

285

Здравствуйте. У меня такой вопрос можно ли сделать таблицу обычную...
Но под нее вставить фон, который распространялся бы на всю ширину форума. Или это надо вставлять в дизайн и если да то куда?
форум вот http://design2208.mybb.ru/

а вот изображение то, что нужно вставить и на ней сделать таблицу поверх

http://s8.uploads.ru/t/0wnzk.jpg

0

286

Доброго времени суток!
Скажите, а больше заказать таблицу для объявлений нельзя?

0

287

Кэтью
Можно... Если кто-то возьмется сделать - Ваш заказ выполнят (вероятность есть... Я сам не занимаюсь этим, ибо времени катастрофически не хватает... Делаю ток самое основное, что без меня не решить

0

288

Alex_63
м, понятно
А заказ можно выложить в эту тему?

0

289

Кэтью
Думаю, да, я перенесу Ваше сообщение в тему по заказу. Массово мы заказы не принимаем, поэтому та тема закрыта, но если кто возьмется делать таблички для юзеров, я открою :)

0

290

Хорошо, спасибо
Позже тогда нарисую макет

+1

291

Здравствуйте!
Скорее всего, такая таблица уже есть, но сколько бы я не искала, код так найти и не смогла.
Если у кого есть такая или может сделать и поделиться, буду очень признательна.

+

https://image.prntscr.com/image/s3WlAIbESPCXbd_Y3WevHg.png

Или, если кто-то может править уже существующую таблицу, на тот вариант, что описан выше:
http://cwtime.rolebb.su/
Я отправлю код таблицы

0

292

Добрый вечер.
Есть табличка с вкладками, невероятно удобная и нужная. Но у меня в оформлении запланирован вариант с вертикальными вкладками. Можно их как-нибудь просто перенести вбок, чтобы было как под спойлером? хд

фоновые картинки для каждой включенной вкладки, как пример

http://sh.uploads.ru/t/zB65j.jpg
http://sh.uploads.ru/t/x7YlG.jpg
http://s8.uploads.ru/t/l2qX5.jpg

0

293

nicknaame
Завтра гляну...

0

294

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

Завтра гляну...

Прошу прощения, я уезжала.
Вопрос ещё актуальный :)

0

295

Прошу прощения, что дублирую, но вопрос и вправду актуальный, а самой не разобраться)
Есть табличка с вкладками, невероятно удобная и нужная. Но у меня в оформлении запланирован вариант с вертикальными вкладками. Можно их как-нибудь просто перенести вбок, чтобы было как под спойлером?

фоновые картинки для каждой включенной вкладки, как пример

http://sh.uploads.ru/t/zB65j.jpg
http://sh.uploads.ru/t/x7YlG.jpg
http://s8.uploads.ru/t/l2qX5.jpg

0

296

nicknaame
В HTML верх:

Код:
<!-- Стиль меню таблицы в объявлении -->
<style type="text/css">
/****************************************
   Таблица с переключаемыми Вкладками
****************************************/
#tab2,#tab2*{
  paddibg:0;
  margin:0;
}
#tab2 {
  background:transparent url(http://sh.uploads.ru/zB65j.jpg) 0 0 no-repeat;
  height:235px;
  width:579px;
  outline:solid red 1px;/* Убираем Строку после настройки*/ 
}
#tab2,#tab2 td{
  border:none 0 transparent!important;
  border-collapse:collapse;
}
#tab2 .butt{
  position:relative;
}
img[data^="tab"]{
  cursor:pointer;
  position:absolute;
  left:300px; /*Отступ слева*/
  z-index:100;
  height:55px;
  outline:solid red 1px;/* Убираем Строку после настройки*/ 
  border:none 0 transparent!important;
}
.tab-content {
  display:none;
  width:241px;
  margin-left:50px;
  height:226px;
  outline:solid blue 1px;/* Убираем Строку после настройки*/
  color:#fff;
  overflow-y:auto;
}
</style>
<script type="text/javascript">
$.fn.switch_tabs = function() {
  var tbl = this,knopK = $("img[data^='tab']",tbl);
  knopK.each(function(){
    var arr = $(this).attr('data').split(",");
    $(this).css("background-image","url("+arr[1]+")")
  }); knopK.css("background-position","120% 10000px")
      knopK.css("background-repeat","no-repeat")
  knopK.click(function(){
    knopK.removeClass('active');
    $(this).addClass('active');
    var arr = $(this).attr('data').split(",");
    tbl.css("background-image","url("+arr[1]+")")
    $(".tab-content",tbl).hide();
    $("#"+arr[0]+"",tbl).show();
  });
}
</script>


Куда надо:

Код:
<table id="tab2" class="tbl-0" border="0">
<tr>
<td class="butt" valign=center height=0>   <!-- Секция кнопок -->
<img width="260" data="tab-1,http://sh.uploads.ru/zB65j.jpg" src="/i/blank.gif" class="active" style="margin-top:10px">
<img width="195" data="tab-2,http://s8.uploads.ru/l2qX5.jpg" src="/i/blank.gif" style="margin-top:82px">
<img width="135" data="tab-3,http://sh.uploads.ru/x7YlG.jpg" src="/i/blank.gif" style="margin-top:153px">
</td>
</tr>
<tr>
<td  class="content" align=left>
<!-- Контейнер контента 1-й кнопки -->
<div id="tab-1" class="tab-content"  style="display:block;">
Контент 1-й кнопки
</div>
<!-- Контейнер контента 2-й кнопки -->
<div id="tab-2" class="tab-content">
Контент 2-й кнопки
</div>
<!-- Контейнер контента 3-й кнопки -->
<div id="tab-3" class="tab-content">
Контент 3-й кнопки
</div>
</td>
</tr>
</table><script>$("#tab2").switch_tabs()</script><!--//End/-switch Tabs -->

Отредактировано Deff (Чт, 30 Авг 2018 22:35:34)

+1

297

Deff, спасибо большое! Стоит и работает как надо :)

0


Вы здесь » Единый форум поддержки » Вопросы по оформлению форума » Общие вопросы по заказу таблиц (2)