Техническая поддержка сервиса Quadro.Boards

riel · Поделиться**761**06.11.2012 18:35:11

kozhilya
~~Спасибо что берётесь.~~
Да без проблем, вот по шаблону. Правда, мало что изменилось:
1. ссылка на форум
http://testriel.rusff.me/
2. ширина форума (ссылка на форум ничего может не показать, если дизайн в разработке).
900px
3. добротный рисунок с границами хотя бы в Paint'е, по которому можно определить чёткое количество столбцов и количество строк (решётку):
http://s1.ipicture.ru/uploads/20121106/JoQh6bbs.png

кнопки

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

+1

Wendy Owen · Поделиться**762**06.11.2012 19:12:04

kozhilya
Спасибо.

0

Мииреена д'Эстер · Поделиться**763**06.11.2012 19:48:42

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

Селектор таблицы { border: none 0px; }

Спасибо

Возник еще один вопрос - а если табличку надо вставить в сообщение на форуме, то в ней как края убрать?
Просто возникает ощущение, что никак, потому что у вас границ нет, а у меня на тестовом они есть... а хотелось бы чтобы в той таблице их везде не было, на всех форумах

0

Rizzyna · Поделиться**764**07.11.2012 11:42:54

1. ссылка на форум
в разработке

2. ширина форума (ссылка на форум ничего может не показать, если дизайн в разработке).
800 px

3. добротный рисунок с границами хотя бы в Paint'е, по которому можно определить чёткое количество столбцов и количество строк (решётку):
общий вид

По игре : http://s1.uploads.ru/sIaOv.png
Актив недели: http://s1.uploads.ru/U9T2Y.png
Реклама и Партнеры : http://s1.uploads.ru/u98yO.png

4. границы у таблицы: есть/нет (нужное подчеркнуть)
только там где они показаны

5. доп.элементы (прокрутка, картинки и т.д.) указывать текстовыми пометками непосредственно в ячейках таблицы рисунка, разборчивым шрифтом.
все как показано на картинках

0

Wendy Owen · Поделиться**765**09.11.2012 14:02:52

1. Волки - Долина Судьбы -
2. --------
3.

Таблица

4. Границы у таблицы: есть/нет (нужное подчеркнуть)
5. Прокрутка в Новостях. Слова "Ссылка" спрятать.
В графе администраторы| модераторы картинки 180х180, увеличивающиеся при наведении.
Шрифт Century Gothic.
В администраторы картинки -
В модераторы - во всех трех окнах.

0

riel · Поделиться**766**10.11.2012 19:52:57

kozhilya, не тороплю, но как скоро выполните?

+1

kozhilya · Поделиться**767**10.11.2012 23:18:43

riel
У меня были свистопляски с компьютером из-за переустановки системы. Но всё позади, и прямо сейчас я займусь заказами.

0

The Sorting Hat · Поделиться**768**11.11.2012 14:47:41

Здравствуйте, нужна помощь с таблицей:
1. Ссылка на форум - http://newhoggame.rusff.me/

2. Ширина форума - ширину самого форума не знаю (даже не в курсе, где посмотреть). Но общая ширина таблица должна быть 919 px... вроде

3. Рисунок таблицы

Свернутый текст

4. границы у таблицы: есть/нет (нужное подчеркнуть)

5. доп.элементы (прокрутка, картинки и т.д.) - дополнения не нужны. Никаких картинок, прокруток, фонов и т.д.

0

kozhilya · Поделиться**769**11.11.2012 18:13:50

Rizzyna
Пока сделал статичную картинку. И ещё я не очень понял, что требуется в блоке "Лучший пост". Напишите, что надо сделать - доделаю.

Демонстрация
Код

<style>
#pun-announcement table.main {
width: 800px;
margin: 0 auto;
border-spacing: 0;
}
#pun-announcement table.main th {
width: 25%;
cursor: pointer;
font-weight: normal;
border: 1px solid black;
}
#pun-announcement table.main th:hover, #pun-announcement table.main th.active {
font-weight: bold;
}
#pun-announcement table.main > tbody > tr > td {
padding: 0;
border: 1px solid black;
}
#pun-announcement table.main th div {
display: none;
}
#pun-announcement table.main tbody div.content {
height: 315px;
text-align: center;
}
#pun-announcement table.main tbody div.content ul li {
border: 1px solid black;
margin-bottom: 2px;
}

#pun-announcement table.main tbody div.content > table { width: 100%; height: 100%; }
.scroll { overflow-y: auto; height: 100%; border: 1px solid black }
img.ava.ad { width: 75px; height: 75px; }
img.ava.mod { width: 50px; height: 50px; }
</style>
<table class="main"><thead><tr>
<th class="active"><span>Основное</span>
<div><table>
<tr><td><div><h6>Админстрация</h6>
<img src="Ссылка на изображение" class="ava ad" />
<img src="Ссылка на изображение" class="ava ad" />
<img src="Ссылка на изображение" class="ava ad" />
</div>
<div><h6>Модераторы</h6>
<img src="Ссылка на изображение" class="ava mod" />
<img src="Ссылка на изображение" class="ava mod" />
<img src="Ссылка на изображение" class="ava mod" />
<img src="Ссылка на изображение" class="ava mod" />
</div>
<div><h6>Полезные ссылки</h6><ul>
<li><a href="Ссылка">Текст ссылки</a></li>
<li><a href="Ссылка">Текст ссылки</a></li>
<li><a href="Ссылка">Текст ссылки</a></li>
<li><a href="Ссылка">Текст ссылки</a></li>
<li><a href="Ссылка">Текст ссылки</a></li>
<li><a href="Ссылка">Текст ссылки</a></li>
<li><a href="Ссылка">Текст ссылки</a></li>
</ul></div>
</td>
<td><h6>Новости форума</h6><div class="scroll">Контент новостей</div></td></tr>
</table></div></th>
<th><span>По игре</span>
<div><table><tr><td><h6>Погода и время в игре</h6>
<div class="scroll">Контент погоды</div></td>
<td><h6>События в игре</h6>
<div class="scroll">Контент событий</div>
</td></tr></table></div></th>
<th><span>Актив недели</span>
<div><table><tr><td><h6>Лучший пост</h6>
<div class="scroll">Контент лучшего поста</div></td></tr></table></div></th>
<th><span>Реклама и партнёрство</span>
<div><table><tr><td><h6>Реклама</h6>
<div class="scroll">Контент рекламы</div></td>
<td><h6>Партнёры</h6>
<div class="scroll">Контент партнёров</div>
</td></tr></table></div></th></tr></thead>

<tbody><tr><td colspan=3><div class="content"></div></td>
<td><img src="Ссылка на картинку" style="height: 100%; width: 100%" /></td></tr></table>

<script>
$('#pun-announcement table.main th').click(function() {
$('#pun-announcement table.main th').removeClass('active');
$("#pun-announcement table.main tbody div.content")
.fadeOut('slow', function() { $(this).html($('#pun-announcement table.main th.active > div').html()); })
.fadeIn('slow');
$(this).addClass('active');
}).filter('.active').trigger('click');
</script>

0

Shivers · Поделиться**770**11.11.2012 18:16:50

Доброго времени суток. Рассчитываю на Вашу помощь, заранее спасибо
1. ссылка на форум
http://silvar.rolka.su/
Он в разработке, но ширина таблиц уже окончательная

2. ширина форума (ссылка на форум ничего может не показать, если дизайн в разработке).
Вроде бы 800 px )

3. добротный рисунок с границами хотя бы в Paint'е, по которому можно определить чёткое количество столбцов и количество строк (решётку):

изображения

4. границы у таблицы: есть/нет (нужное подчеркнуть)

5. доп.элементы (прокрутка, картинки и т.д.) указывать текстовыми пометками непосредственно в ячейках таблицы рисунка, разборчивым шрифтом.
Значки типа "администрация", "приветствие", "информация", "основное", "партнеры" и ост. хотелось бы что б были ни как текст, а как кликабельные картинки, которые нужно вставить на это место. Цвет таблицы - прозрачный.

Отредактировано Shivers (12.11.2012 21:16:04)

0

kozhilya · Поделиться**771**11.11.2012 18:29:09

riel
Весёлый у вас заказик

Код

<table class="main"><thead><tr>
<th class="active"><img src="http://s1.ipicture.ru/uploads/20121106/epIXfQmV.png" />
<div>Контент 1</div>
</th>
<th class="active"><img src="http://s1.ipicture.ru/uploads/20121106/c6UIRRTq.png" />
<div>Контент 1</div>
</th>
<th class="active"><img src="http://s1.ipicture.ru/uploads/20121106/7pJrxZcc.png" />
<div>Контент 1</div>
</th>
<th class="active"><img src="http://s1.ipicture.ru/uploads/20121106/ZuNofXK4.png" />
<div>Контент 1</div>
</th>
</tr></thead>
<tbody><tr><td colspan=4><div class="content"></div></td></tr></table>

<script>
$('#pun-announcement table.main th').click(function() {
$('#pun-announcement table.main th').removeClass('active');
$("#pun-announcement table.main tbody div.content")
.fadeOut('slow', function() { $(this).html($('#pun-announcement table.main th.active > div').html()); })
.fadeIn('slow');
$(this).addClass('active');
}).filter('.active').trigger('click');
</script>

0

riel · Поделиться**772**11.11.2012 19:05:45

kozhilya
Очень. Особенно то, как он отображается.
http://testriel.rusff.me/
Информация при нажатии мигает, "Контент 1" и т. д. что выделенные жирным откуда там взялись? Оо Возможно ведь их всех по центру выровнять? Спасибо с:

0

kozhilya · Поделиться**773**11.11.2012 19:12:29

riel
А вот с миганием... У меня его нет.

Код

<style>#pun-announcement { margin: auto; }
#pun-announcement th div { display: none; }
</style>
<table class="main"><thead><tr>
<th class="active"><img src="http://s1.ipicture.ru/uploads/20121106/epIXfQmV.png" />
<div>Контент 1</div>
</th>
<th class="active"><img src="http://s1.ipicture.ru/uploads/20121106/c6UIRRTq.png" />
<div>Контент 1</div>
</th>
<th class="active"><img src="http://s1.ipicture.ru/uploads/20121106/7pJrxZcc.png" />
<div>Контент 1</div>
</th>
<th class="active"><img src="http://s1.ipicture.ru/uploads/20121106/ZuNofXK4.png" />
<div>Контент 1</div>
</th>
</tr></thead>
<tbody><tr><td colspan=4><div class="content"></div></td></tr></table>
<script>
$('#pun-announcement table.main th').click(function() {
$('#pun-announcement table.main th').removeClass('active');
$("#pun-announcement table.main tbody div.content")
.fadeOut('slow', function() { $(this).html($('#pun-announcement table.main th.active > div').html()); })
.fadeIn('slow');
$(this).addClass('active');
}).filter('.active').trigger('click');
</script>

0

kozhilya · Поделиться**774**11.11.2012 19:18:55

Wendy Owen

Демонстрация
Код:

<style>
#pun-announcement {
text-align: center;
}
#pun-announcement table {
width: 100%;
}
#pun-announcement h5 {
margin-top: 5px;
font-size: 15px;
}
#pun-announcement img.ava {
width: 100px;
height: 100px;
}
.border-box {
border: 1px solid black !important;
}
</style>
<table>
<tr><td class="border-box">
<ul>
<li><h5>Важное</h5></li>
<li><a href="Ссылка">Текст Ссылки</a></li>
<li><a href="Ссылка">Текст Ссылки</a></li>
<li><a href="Ссылка">Текст Ссылки</a></li>
<li><a href="Ссылка">Текст Ссылки</a></li>
<li><a href="Ссылка">Текст Ссылки</a></li>
<li><h5>Активные квесты</h5></li>
<li><a href="Ссылка">Текст Ссылки</a></li>
<li><a href="Ссылка">Текст Ссылки</a></li>
<li><a href="Ссылка">Текст Ссылки</a></li>
<li><h5>Развлечения</h5></li>
<li><a href="Ссылка">Текст Ссылки</a></li>
<li><a href="Ссылка">Текст Ссылки</a></li>
<li><a href="Ссылка">Текст Ссылки</a></li>
</ul></td>
<td><div style="overflow-y: auto; height: 100px;" class="border-box"><h5>Новости</h5>

Текст</div><br />
<div class="border-box"><h5>Администраторы</h5>
<img src="http://s3.uploads.ru/t/S6Xif.jpg" class="ava" />
<img src="http://s2.uploads.ru/t/KQuke.jpg" class="ava" />
<img src="http://s3.uploads.ru/t/jHqr5.png" class="ava" />
<h5>Модераторы</h5>
<img src="http://s3.uploads.ru/t/jHqr5.png" class="ava" />
<img src="http://s3.uploads.ru/t/jHqr5.png" class="ava" />
<img src="http://s3.uploads.ru/t/jHqr5.png" class="ava" />
</div></td>
<td><div class="border-box" style="height: 55px;"><h5>PR</h5>
<strong>Ник</strong> - PR<br />
<strong>Пароль</strong> - 1111</div><br />
<div class="border-box" style="height: 213px;padding-top: 82px;"><ul>
<li><h5>Реклама</h5></li>
<li><a href="Ссылка">Текст Ссылки</a></li>
<li><a href="Ссылка">Текст Ссылки</a></li>
<li><a href="Ссылка">Текст Ссылки</a></li>
<li><h5>Гости</h5></li>
<li><a href="Ссылка">Текст Ссылки</a></li>
<li><a href="Ссылка">Текст Ссылки</a></li>
<li><a href="Ссылка">Текст Ссылки</a></li>
</ul></div></td>
</tr>
</table>

+1

riel · Поделиться**775**11.11.2012 22:54:18

kozhilya
Мигает же Оо Проверяла в Мозилле и Хроме, а как ни странно и тут и там та же песня. Что же это может быть?
Кстати, почему при загрузке страницы показывает сразу инфу из 4 контента, а не из 1? http://testriel.rusff.me/
А так всё чудесно, за исключением мигания, за что я благодарна с:

Отредактировано riel (12.11.2012 12:08:22)

0

Gerra · Поделиться**776**12.11.2012 15:09:28

1. ссылка на форум
Клик
2. ширина форума (ссылка на форум ничего может не показать, если дизайн в разработке).
890
3. добротный рисунок с границами хотя бы в Paint'е, по которому можно определить чёткое количество столбцов и количество строк (решётку):

Там где пустое окно пиксельная картинка, вставлю сама
4. границы у таблицы: есть/нет (нужное подчеркнуть)
Есть только красное окно и четыре столбца новостей внизу.
5. доп.элементы (прокрутка, картинки и т.д.) указывать текстовыми пометками непосредственно в ячейках таблицы рисунка, разборчивым шрифтом.
Всё указанно

Заранее спасибо.

Отредактировано Gerra (12.11.2012 15:51:16)

0

kozhilya · Поделиться**777**13.11.2012 08:53:48

riel
Множественное копирование - зло.

Код

<table class="main"><thead><tr>
<th class="active"><img src="http://s1.ipicture.ru/uploads/20121106/epIXfQmV.png" />
<div>Контент 1</div>
</th>
<th><img src="http://s1.ipicture.ru/uploads/20121106/c6UIRRTq.png" />
<div>Контент 2</div>
</th>
<th><img src="http://s1.ipicture.ru/uploads/20121106/7pJrxZcc.png" />
<div>Контент 3</div>
</th>
<th><img src="http://s1.ipicture.ru/uploads/20121106/ZuNofXK4.png" />
<div>Контент 4</div>
</th>
</tr></thead>
<tbody><tr><td colspan=4><div class="content"></div></td></tr></table>
<script>
$('#pun-announcement table.main th').click(function() {
$('#pun-announcement table.main th').removeClass('active');
$("#pun-announcement table.main tbody div.content")
.fadeOut('slow', function() { $(this).html($('#pun-announcement table.main th.active > div').html()); })
.fadeIn('slow');
$(this).addClass('active');
}).filter('.active').trigger('click');
</script>

0

kozhilya · Поделиться**778**13.11.2012 10:11:14

The Sorting Hat

Демонстрация
Код:

<style>
#pun-announcement table.main {
width: 919px;
border-spacing: 0px;
height: 300px;
margin: auto;
}
#pun-announcement table.main td {
border: none;
padding: 0;
}
#pun-announcement table.main td.buttons {
width: 150px;
}
#pun-announcement table.main td.buttons ul {
margin: auto;
}
#pun-announcement table.main td.buttons li span {
display: block;
text-align: center;
margin: 12px 0;
cursor: pointer;
}
#pun-announcement table.main td.buttons li div {
display: none;
}
#pun-announcement table.main div.content {
height: 100%;
overflow-y: auto;
text-align: center
}
</style>

<table class="main"><tr><td class="buttons"><ul>
<li class="active"><span>События в игре</span>
<div>Контент событий</div></li>
<li><span>Информация</span>
<div>Контент информации</div></li>
<li><span>Навигация</span>
<div>Контент навигации</div></li>
<li><span>Акции</span>
<div>Контент акций</div></li>
<li><span>Администрация</span>
<div>Контент администрации</div></li>
<li><span>Баннеры</span>
<div>Контент баннеров</div></li>
</ul></td>
<td><div class="content"></div></td></tr></table>

<script>
$('#pun-announcement table.main td.buttons li').click(function() {
$('#pun-announcement table.main td.buttons li').removeClass('active');
$(this).addClass('active');
$('#pun-announcement table.main div.content')
.hide('slow', function() { $(this).html($('#pun-announcement table.main td.buttons li.active > div').html()); })
.show('slow');
}).filter('.active').trigger('click')
</script>

0

kozhilya · Поделиться**779**13.11.2012 11:09:54

Shivers

Демонстрация
Код:

<style>
#pun-announcement table.main {
margin: auto;
width: 800px;
height: 300px;
text-align: center;
}
#pun-announcement table.main * {
margin: auto;
}
#pun-announcement .main th {
width: auto;
}
#pun-announcement .main th div {
display: none;
}
#pun-announcement .main .content > img {
display: block;
}
#pun-announcement .main .content .ava img {
width: 50px; height: 50px;
}
#pun-announcement .main .content .banners img {
height: 31px; width: 88px;
}
</style>
<table class="main"><thead><tr>

<th class="active"><span>Основное</span>
<div><img src="Ссылка на картинку с приветствием" />
<div style="width: 600px; height: 150px; border: 1px dashed black">Текст приветствия</div>
<img src="Ссылка администрации" />
<div class="ava"><img src="Ссылка на аватар" />
<img src="Ссылка на аватар" />
<img src="Ссылка на аватар" />
<img src="Ссылка на аватар" /></div>
</div></th>

<th><span>Информация</span>
<div>
<table><tr><td><ul>
<li><a href="Ссылка">Текст ссылки 1</a></li>
<li><a href="Ссылка">Текст ссылки 2</a></li>
<li><a href="Ссылка">Текст ссылки 3</a></li>
<li><a href="Ссылка">Текст ссылки 4</a></li>
<li><a href="Ссылка">Текст ссылки 5</a></li>
</ul></td>
<td><img src="Ссылка на картинку с надписью События" />
<div style="scroll: auto; height: 200px">Контент событий</div></td></tr></table>
</div></th>

<th><span>Патнёры</span>
<div><img src="Ссылка на картинку с надписью Баннеры" />
<div class="banners"><img src="Баннер" /><img src="Баннер" /><img src="Баннер" /></div></div></th>

</tr></thead><tbody><tr><td colspan=3><div class="content"></div></td></tr></table>

<script>
$('#pun-announcement table.main th').click(function() {
$('#pun-announcement table.main th').removeClass('active');
$("#pun-announcement table.main tbody div.content")
.fadeOut('slow', function() { $(this).html($('#pun-announcement table.main th.active > div').html()); })
.fadeIn('slow');
$(this).addClass('active');
}).filter('.active').trigger('click');
</script>

0

riel · Поделиться**780**13.11.2012 12:02:58

kozhilya
Не отрицаю.
Возможно убрать жирные подписи под картинками и не нарушить целостность таблицы? Заранее спасибо, и мигать перестало.

0

Техническая поддержка сервиса Quadro.Boards

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

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

Объявление

Новости сервиса

О форуме

Полезные ссылки

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

FAQ по самостоятельному составлению HTML-таблицы и Заказ Таблиц

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

Поделиться76106.11.2012 18:35:11

Поделиться76206.11.2012 19:12:04

Поделиться76306.11.2012 19:48:42

Поделиться76407.11.2012 11:42:54

Поделиться76509.11.2012 14:02:52

Поделиться76610.11.2012 19:52:57

Поделиться76710.11.2012 23:18:43

Поделиться76811.11.2012 14:47:41

Поделиться76911.11.2012 18:13:50

Поделиться77011.11.2012 18:16:50

Поделиться77111.11.2012 18:29:09

Поделиться77211.11.2012 19:05:45

Поделиться77311.11.2012 19:12:29

Поделиться77411.11.2012 19:18:55

Поделиться77511.11.2012 22:54:18

Поделиться77612.11.2012 15:09:28

Поделиться77713.11.2012 08:53:48

Поделиться77813.11.2012 10:11:14

Поделиться77913.11.2012 11:09:54

Поделиться78013.11.2012 12:02:58