ForumD.ru - Дизайн, графика, скрипты, техническая поддержка для форумов и сайтов

Объявление

🎲 Майский ваншот

Ленивая сезонная майская акция
Сыграем в настольную игру в дискорде?
Пишите, присоединяйтесь к обсуждению!

Подробности

GEMcross

Кроссовер, ориентированный на активную игру и уютный флуд.
Собираем у себя драгоценных игроков уже почти три года.

Посетить

🔥 Новинка в портфолио: ДИЗАЙН И ГРАФИКА В СТИЛЕ GENSHIN IMPACT

Платформа: MyBB.ru (RusFF)
Стоимость: 6500 рублей;
Авторы: Moju & wasurenagusa

Посмотреть

💰 Теперь у нас можно приобрести "Мгновенные уведомления от Алекса"

Скрипт оповещает пользователей о событиях на форуме в реальном времени, придавая динамики общению.
Автор: Alex_63 | Платформа: MyBB.ru.

У нас: структурированная документация, возможность платить иностранными картами, перевыпустить подписку или купить бессрочно.

Купить скрипт

🌟 ОПЛАТА ЗАКАЗА НАГРАДНЫМИ БАЛЛАМИ И СКИДКИ

Заказы можно оплачивать наградными баллами (НБ). Полностью или частично.
Бартер за НБ осуществляется на условиях платного заказа, в качестве оплаты - НБ.
А если у вас есть любой платный заказ, вы можете обменять НБ на скидочные купоны.

узнать подробности

❤️ Поддержать проект

Если у вас есть желание помочь нам сделать наш проект лучше:
Реклама на сайте • Предложения
Стать модератором • Отзывы

Подробнее

SPECIAL OFFER: We distribute designs for free

Finalizing the layout for your project;
Developing a style code;
Mobile version included if you wish.

Details

Support the project

If you want to help us:
Become a moderator
Suggestions • Reviews

Details
СкрытьПоказать
❗ ❗ ❗ Technical work is underway. We'll fix it soon. :) If you're english-speaker and want to use our forum, switch to the russian language. This is temporary, until the works with multi-language option will be done. Sorry for the inconvenience.

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

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

Таблица. HTML.

Страница: 1
Тема закрыта

Сообщений 1 страница 10 из 10

1

  • Автор: Сова717
  • Бестелесный дух прошлого
  • Уважение: +19

1. Ссылка на форум: http://perfectaworld.rolka.su/
2. Эскиз таблицы:

Первая вкладка (открыта по умолчанию)

http://zagruzitfoto.com/images/2014/02/17/6IK3Z.png

Вторая вкладка

http://zagruzitfoto.com/images/2014/02/17/uOvJD.png

Третья вкладка

http://zagruzitfoto.com/images/2014/02/17/tsaRp.png

3. Дополнительные предпочтения:
Фон - прозрачный.

0

2

  • Автор: Сова717
  • Бестелесный дух прошлого
  • Уважение: +19

Актуально

0

3

  • Автор: Jii-Jo
  • Бестелесный дух прошлого
  • Jii-Jo
  • Уважение: +394

Сова717
Принимаю, к среде будет готово http://uploads.ru/i/K/Z/U/KZUwI.gif

0

4

  • Автор: Сова717
  • Бестелесный дух прошлого
  • Уважение: +19

Среда... Уже прошла. Я не имею права торопить, но хотелоь бы узнать на счет таблицы...

0

5

  • Автор: Сова717
  • Бестелесный дух прошлого
  • Уважение: +19

Все еще актуально

0

6

  • Автор: Jii-Jo
  • Бестелесный дух прошлого
  • Jii-Jo
  • Уважение: +394

Сова717
Извините, что так вот получилось)
Завтра будет :)

0

7

  • Автор: Сова717
  • Бестелесный дух прошлого
  • Уважение: +19

Jii-Jo
Ничего, я все понимаю, все мы люди. Спасибо, что вспомнили

0

8

  • Автор: Jii-Jo
  • Бестелесный дух прошлого
  • Jii-Jo
  • Уважение: +394

Сова717

Объявление
Код:
<ul class="tabs">
    <li class="active"><a href="#tab1">Контейнер 2</a></li>
    <li class=""><a href="#tab2">Контейнер 1</a></li>
    <li class=""><a href="#tab3">Контейнер 3</a></li>
</ul>

      <div class="tab_container1">

<div style="display: none;" id="tab2" class="tab_content">

<table border="1" cellpadding="1" cellspacing="1" style="width: 100%; height: 334px;">
	<tbody>
    <tr>
    	<td style="text-align: center;height: 17%;"><div style="height: 320px; width: 100%; overflow-y: scroll; overflow-x: hidden;">
    Текст
    	<div></div></div></td>

    	<td style="text-align: center;height: 17%;"><div style="height: 320px;  width: 100%;  overflow-y: scroll;  overflow-x: hidden;">
    Текст
    	<div></div></div></td>
    </tr>
	</tbody>
</table>

</div>

<div style="display: block;" id="tab1" class="tab_content">
<table border="1" cellpadding="1" cellspacing="1" style=" width: 100%;  height: 332px;">
	<tbody>
    <tr>
    	<td style="width: 50%;"><div style="height: 100%;width: 100%; overflow-y: scroll;  overflow-x: hidden;">
    Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст Текст 
Т<div></div></div></td>
    	<td rowspan="2" style="text-align: center;"><div style="height: 320px; width: 100%; overflow-y: scroll; overflow-x: hidden;">
    Текст
    	<div></div></div></td>
    </tr>
    <tr>
    	<td style="text-align: center;"><div style="height: 100%;  width: 100%;  overflow-y: scroll;  overflow-x: hidden;">
    Текст
    	<div></div></div></td>
    </tr>
	</tbody>
</table>


</div>

<div style="display: none;" id="tab3" class="tab_content"> 

<table border="1" cellpadding="1" cellspacing="1" style="width: 100%; height: 332px;">
	<tbody>
    <tr>
    	<td colspan="3" rowspan="1" style="text-align: center;height: 17%;">Баннеры</td>
    	<td style="text-align: center;">ПР</td>
    </tr>
    <tr>
    	<td colspan="3" rowspan="1" style="text-align: center;height: 7%;">Навигация</td>
    	<td colspan="1" rowspan="2">
        <p align="center">АМС</p>
        <p align="center"><div style="height: 248px;  width: 100%;  overflow-y: scroll;  overflow-x: hidden;">
    	список
        </div></p>
    	</td>
    </tr>
    <tr>
    	<td colspan="2" style="text-align: center;">1</td>
    	<td style="text-align: center;">2</td>
    </tr>
	</tbody>
</table>

</div>

      </div>
<style>
.container1 {width: 900px; margin: 0 auto; padding: 0;}
ul.tabs {
    margin: 0;
    padding: 0;
    float: left;
    list-style: none;
    height: 40px;
    width: 100%;
}
ul.tabs li {
    float: left;
    margin: 0;
    padding: 0;
    height: 38px;
    line-height: 40px;

        
        
    overflow: hidden;
    position: relative;
    border: 1px solid black;
    margin-left: 140px;
}

ul.tabs li a {
    text-decoration: none;
    color: black;
    display: block;
    padding: 0 5px;
    outline: none;
}

ul.tabs li a:hover {
       background: url();
    border-bottom: 0px solid #000000;
        border-top: 0px solid #000000;    
        border-left: 0px solid #000000;    
        border-right: 0px solid #000000;  
}    

html ul.tabs li.active  {
    background: transparent;    
            
            
           
    box-shadow: 0px 0px 1px black;
}  

html ul.tabs li.active a:hover  {
        background: transparent;
    
}

.tab_container1 {
    clear: both;
    float: left; 
    width: 840px;
    height: 343px;   

    background: transparent;  
            
            
        
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.6);  

    -khtml-border-radiua: 4px;
    -moz-border-radius: 4px;
    -khtml-border-radius: 4px;
    -webkit-border-radius: 4px;
}

.tab_content {
    padding: 5px;
}

.tab_content h2 {
    font-weight: normal;
    padding-bottom: 2px;
    border-bottom: 0px dashed #000000;
}
</style>
<script type="text/javascript">
  $(document).ready(function(){
    $('.splLink').click(function(){
      $(this).parent().children('div.splCont').toggle('normal');
      return false;
    });
  });
</script>
<script type="text/javascript">

$(document).ready(function() {


	$(".tab_content").hide(); 
	$("ul.tabs li:first").addClass("active").show();
	$(".tab_content:first").show();
	
	$("ul.tabs li").click(function() {
    $("ul.tabs li").removeClass("active");
    $(this).addClass("active");
    $(".tab_content").hide();
    var activeTab = $(this).find("a").attr("href");
    $(activeTab).fadeIn();
    return false;
	});

});

</script>

Чтобы убрать границы таблицы - заменяем в трех таблицах 1 на 0:

<table border="1" cellpadding="1" cellspacing="1" style="width: 100%; height: 334px;">

Чтобы сделать прокрутку, которая появляется только при содержимом, больше чем она вмещается, заменяем все scroll на auto:

<div style="height: 248px;  width: 100%;  overflow-y: scroll;  overflow-x: hidden;">

http://uploads.ru/i/K/Z/U/KZUwI.gif

0

9

  • Автор: Сова717
  • Бестелесный дух прошлого
  • Уважение: +19

Jii-Jo
Спасибо огромное.
А, еще вопрос. Как ее сдвинуть на центр? <center></center> Что то не работает. Я, наверно, что то не так сделала

0

10

  • Автор: Сова717
  • Бестелесный дух прошлого
  • Уважение: +19

Jii-Jo
Все, проблема решена

0

Тема закрыта
Страница: 1