Перейти к контенту

"Табличное" отображение информации о пользователе под аватар


Рекомендуемые сообщения

кто подскажет как зделать табличное отображение информации о пользователе под аватаром в темах, и возможно вобще ли так зделать? вот как здесь: http://s57.radikal.ru/i156/0906/0a/19d72cf2c8bd.gif
Ссылка на комментарий
Поделиться на других сайтах

Тоже этот вопрос интересует. А еще, нельзя ли сделать так, чтобы эту информацию можно было показать/скрыть, вот как здесь: http://img189.imageshack.us/img189/5428/434343.jpg
Ссылка на комментарий
Поделиться на других сайтах

А зачем вам моды для такой простой задачи? оО

 

1. Открываем skin_topic (просмотр темы) > RenderRow, находим там:

 

{$author['member_group']}<br />
{$author['member_posts']}<br />
{$author['member_joined']}<br />
{$author['member_location']}
{$author['member_number']}<br />

 

Меняем на:

 

<table id="tableuserinfo" cellpadding="0" cellspacing="0">
<tr><td>{$author['member_group']}</td></tr>
<tr><td>{$author['member_posts']}</td></tr>
<tr><td>{$author['member_joined']}</td></tr>
<tr><td>{$author['member_location']}</td></tr>
<tr><td>{$author['member_number']}</td></tr>
</table>

 

Все, у нас теперь табличное отображение =)

 

2. Чтобы оно смотрелось поинтересней, добавляем в общую css:

 

#tableuserinfo { width: 200px; margin: 0px auto; border: 0px; border-collapse: collapse; }
#tableuserinfo th { height: 16px; }
#tableuserinfo td { background: #cccccc; border: 1px solid #ffffff; /* а лучше - фоновую картинку в бекграунд */ }

 

3. Чтобы оно сворачивалось-разворачивалось могу предложить простой javascript. В skin_global > global_board_header в начало добавим:

 

<script type="text/javascript">
//<![CDATA[
function un_cut(el){
 el.getElementsByTagName("div")[0].style.display = "inline";  
 el.getElementsByTagName("a")[0].style.display = "none";
}
//]]>
</script>

 

И поместить нашу таблицу внутрь следующей конструкции:

 

<div style="display: inline;"><a href="java script:void(0);" onclick="un_cut(this.parentNode)">Еще...</a><div style="display: none;">
<table id="tableuserinfo" cellpadding="0" cellspacing="0">
<tr><td>{$author['member_group']}</td></tr>
<tr><td>{$author['member_posts']}</td></tr>
<tr><td>{$author['member_joined']}</td></tr>
<tr><td>{$author['member_location']}</td></tr>
<tr><td>{$author['member_number']}</td></tr>
</table></div></div>

 

4. И чтобы наш javascript не пропадал, давайте сразу сделаем еще и тег [cut=кратко]подробно[/cut]:

 

Управление > Добавить BB-код:

 

Название: Кат

Пример использования: [cut=подробнее..]блаблабла[/cut]

Тег: cut

Использовать опции в теге? Да

Поменять option и content местами? Нет

Шаблон замены BB-кода:

 

<div style="display:inline;"><a href="java script:void(0);" onclick="un_cut(this.parentNode)">{option}</a><div style="display: none;">{content}</div></div>

Ссылка на комментарий
Поделиться на других сайтах

А зачем вам моды для такой простой задачи? оО

 

1. Открываем skin_topic (просмотр темы) > RenderRow, находим там:

Это и есть мод (=

 

3. Чтобы оно сворачивалось-разворачивалось могу предложить простой javascript.

А за это - спасибо! :D

Ссылка на комментарий
Поделиться на других сайтах

Prokur@tor, ну, знаете ли))) Имхо, мод - это вмешательство в скрипты форума, делающее его несовместимым с оригинальным дистрибутивом. А редактирование шаблонов... так, баловство)

 

Кстати, скрипт только разворачивает. Двухстороннее изменение делает этот:

 

function un_cut(el){
 el.getElementsByTagName("div")[0].style.display = "inline";  
 el.getElementsByTagName("a")[0].style.display = "none";
}
function re_cut(el){
 el.getElementsByTagName("div")[0].style.display = "none";  
 el.getElementsByTagName("a")[0].style.display = "inline";
}

 

И, соответственно, в BB-коде:

<div style="display:inline;"><a href="java script:void(0);" onclick="un_cut(this.parentNode)">{option}</a><div style="display: none;" onDblClick="re_cut(this.parentNode)">{content}</div></div>

и в шаблоне:

<div style="display: inline;"><a href="java script:void(0);" onclick="un_cut(this.parentNode)">Еще...</a><div style="display: none;" onDblClick="re_cut(this.parentNode)">
<table id="tableuserinfo" cellpadding="0" cellspacing="0">
<tr><td>{$author['member_group']}</td></tr>
<tr><td>{$author['member_posts']}</td></tr>
<tr><td>{$author['member_joined']}</td></tr>
<tr><td>{$author['member_location']}</td></tr>
<tr><td>{$author['member_number']}</td></tr>
</table></div></div>

 

Сворачивается все даблкликом по развернувшемуся в любом месте)

Ссылка на комментарий
Поделиться на других сайтах

Кстати, скрипт только разворачивает. Двухстороннее изменение делает этот:

Странно, сделал все, как надо, нажимаю на развернуть, он разворачивает и заходит на страницу www.сайт/java%20script:void(0);

Что делать?)

Ссылка на комментарий
Поделиться на других сайтах

Странно, 2 года на форуме, а не запомнили, что он слово javascript разрывает и его нужно слитно писать.

 

Одним словом тупо копипастить не получится.

Ссылка на комментарий
Поделиться на других сайтах

Странно, 2 года на форуме, а не запомнили, что он слово javascript разрывает и его нужно слитно писать.

Блин, точно))

 

А я еще нашел такой скрипт:

<div style="display:normal" id="fc_10{$post['post_count']}"><a href="java script:togglecategory(10{$post['post_count']}, 0);">+ info</a>
</div>

<div style="display:none" id="fo_10{$post['post_count']}"><a href="java script:togglecategory(10{$post['post_count']}, 1);"><div class="info1">- info</a><br />информация, которую необходимо скрыть</div>

 

Подскажите, в чем они различаются, и какой лучше?

Ссылка на комментарий
Поделиться на других сайтах

Чтобы окружить границами поля профиля, вы целую таблицу составляете? Оо

ну знаете ли...

Изменено пользователем idTails
Ссылка на комментарий
Поделиться на других сайтах

href="java script:togglecategory(10{$post['post_count']}, 1);

Вызов функции вижу, а сама функция где?

 

Когда писал un_cut/re_cut - главная задача была - обойтись без нумерации/иной_маркировки всех скрывающихся/раскрывающихся блоков, потому что скрипт должен быть универсальным и на базе одного кода работать везде. Поэтому используется конструкция на базе this.parentNode.

 

В приведенном же вами примере всем блокам дается идентификатор "id="fo_10{$post['post_count']}", содержащий номер поста. Это значит, что дважды в пределах одного поста его не используешь, вне тела поста также он не применим, и тега [cut] из него не сделаешь без вмешательства в BBCode-парсер форума.

 

Чтобы окружить границами поля профиля, вы целую таблицу составляете? Оо

ну знаете ли...

Да, вот представляете - рвем себе задницы практически, непомерный труд совершаем - СОСТАВЛЯЕМ ТАБЛИЦУ!!!111-один-один! Аааааааа! Ужас-ужас! Целую ТАБЛИЦУ! Нет, вы поняли, ТАБЛИЦУ! ЦЕЛУЮ! Ох и тяжко нам, болезным! Цельную ТАБЛИЦУ составляем!))))

 

Не вижу ничего страшного в использовании таблицы на форуме, почти целиком сверстанном в таблицах.

Изменено пользователем Ritsuka
Ссылка на комментарий
Поделиться на других сайтах

Да, вот представляете - рвем себе задницы практически, непомерный труд совершаем - СОСТАВЛЯЕМ ТАБЛИЦУ!!!111-один-один! Аааааааа! Ужас-ужас! Целую ТАБЛИЦУ! Нет, вы поняли, ТАБЛИЦУ! ЦЕЛУЮ! Ох и тяжко нам, болезным! Цельную ТАБЛИЦУ составляем!))))

Врача?

Пример:

<div class="userinfo">{$author['member_group']}</div>

Css:

.userinfo
{
background: #FFF8DC;
border: 1px solid #CCCCCC;
border-bottom-width: 2px;
border-right-width: 2px;
padding: 3px 2px 3px 2px;
margin: 2px 1px 3px 1px;
}

 

 

Как-то так

 

3. Чтобы оно сворачивалось-разворачивалось могу предложить простой javascript. В skin_global > global_board_header в начало добавим:

Как-то не очень просто :D

до СВОРАЧИВАЕМОЙ ИНФЫ:

<span><a href="#" onclick="
obj=this.parentNode.childNodes[1].style;
tmp=(obj.display!='block') ? 'block' : 'none';
obj.display=tmp;
return false;">Информация</a><div style="display: none">

После СВОРАЧИВАЕМОЙ ИНФЫ:

</div></span>

Ссылка на комментарий
Поделиться на других сайтах

Чтобы окружить границами поля профиля, вы целую таблицу составляете? Оо

ну знаете ли...

Да, вот представляете - рвем себе задницы практически, непомерный труд совершаем - СОСТАВЛЯЕМ ТАБЛИЦУ!!!111-один-один! Аааааааа! Ужас-ужас! Целую ТАБЛИЦУ! Нет, вы поняли, ТАБЛИЦУ! ЦЕЛУЮ! Ох и тяжко нам, болезным! Цельную ТАБЛИЦУ составляем!))))

Идите учитесь.

Врача?

Уже поздно спасать :D

 

href="java script:togglecategory(10{$post['post_count']}, 1);

Вызов функции вижу, а сама функция где?

В ИПБ она. ;)

Ссылка на комментарий
Поделиться на других сайтах

В ИПБ она.

Ясненько. А она случайно в cookies не записывает лишнего мусора? Пропорционального количеству "раскрытых" боксов?

Изменено пользователем Ritsuka
Ссылка на комментарий
Поделиться на других сайтах

Ясненько. А она случайно в cookies не записывает лишнего мусора? Пропорционального количеству "раскрытых" боксов?

Не знаю, не доводилось смотреть.

У меня по другому сделано.

Изменено пользователем idTails
Ссылка на комментарий
Поделиться на других сайтах

Если пользователь что-то просит, почему бы ему не предоставить лучше вариант?

Пожалуй приведу и решение с учетом ваших пожеланий:

 

1. Открываем skin_topic (просмотр темы) > RenderRow, находим там:

 

{$author['member_group']}<br />
{$author['member_posts']}<br />
{$author['member_joined']}<br />
{$author['member_location']}
{$author['member_number']}<br />

 

 

Меняем на:

 

<div style="display: inline;"><a href="java script:void(0);" onclick="un_cut(this.parentNode)">Еще...</a><div id="userinfo" style="display:none;" onDblClick="re_cut(this.parentNode)">
<div>{$author['member_group']}</div>
<div>{$author['member_posts']}</div>
<div>{$author['member_joined']}</div>
<div>{$author['member_location']}</div>
<div>{$author['member_number']}</div>
</div></div>

 

2. Чтобы оно смотрелось "таблично", добавляем в общую css:

 

#userinfo { display: block; overflow: hidden; width: 200px; margin: 5px auto; border: 1px solid #cccccc;  /* и какой-нибудь вертикальный градиент в бэкграунд */}
#userinfo div { display: block; width: 200px; border-bottom: 1px solid #cccccc; text-align: center; line-height: 24px; }

 

3. Чтобы оно сворачивалось-разворачивалось в skin_global > global_board_header в начало добавим:

 

<script type="text/javascript">
//<![CDATA[
function un_cut(el){
 el.getElementsByTagName("div")[0].style.display = "inline";  
 el.getElementsByTagName("a")[0].style.display = "none";
}
function re_cut(el){
 el.getElementsByTagName("div")[0].style.display = "none";  
 el.getElementsByTagName("a")[0].style.display = "inline";
}
//]]>
</script>

 

4. И чтобы наш javascript не пропадал, давайте сразу сделаем еще и тег [cut=кратко]подробно[/cut]:

 

Управление > Добавить BB-код:

 

Название: Кат

Пример использования: [cut=подробнее..]блаблабла[/cut]

Тег: cut

Использовать опции в теге? Да

Поменять option и content местами? Нет

Шаблон замены BB-кода:

 

<div style="display:inline;"><a href="java script:void(0);" onclick="un_cut(this.parentNode)">{option}</a><div style="display: none;"  onDblClick="re_cut(this.parentNode)">{content}</div></div>

Изменено пользователем Ritsuka
Ссылка на комментарий
Поделиться на других сайтах

Наверно, вы редактировали своё сообщение...

Так предоставьте же наконец! Хватит трепаться, просто сделайте это. Не наброски и умные мысли на тему, а решение.
Чиба уже предоставил.
Изменено пользователем idTails
Ссылка на комментарий
Поделиться на других сайтах

Вот это вы называете "решением"?))))

 

Пример:

<div class="userinfo">{$author['member_group']}</div>

Css:

.userinfo
{
background: #FFF8DC;
border: 1px solid #CCCCCC;
border-bottom-width: 2px;
border-right-width: 2px;
padding: 3px 2px 3px 2px;
margin: 2px 1px 3px 1px;
}

 

Как-то так

 

Ну, с пивом для опытного админа форума прокатит, да)))

Ссылка на комментарий
Поделиться на других сайтах

Вот это вы называете "решением"?))))

Ну, с пивом для опытного админа форума прокатит, да)))

Да, это одно из ВАРИАНТОВ решений. И уж получше вашей СОЗДАННОЙ таблицы с её табле, тр и тд. :D

Изменено пользователем idTails
Ссылка на комментарий
Поделиться на других сайтах

Сейчас достану банхаммер...

 

И вообще, если уж говорить о семантике, это и не дивы и не таблица, а скорее <ul><li> или <dl><dt>. Так что харе препираться и кормить молодых троллей :D

Ссылка на комментарий
Поделиться на других сайтах

Сейчас достану банхаммер...

 

И вообще, если уж говорить о семантике, это и не дивы и не таблица, а скорее <ul><li> или <dl><dt>. Так что харе препираться и кормить молодых троллей :D

А мы уже откорректировали всё ;)

Изменено пользователем idTails
Ссылка на комментарий
Поделиться на других сайтах

Присоединиться к обсуждению

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

Гость
Ответить в этой теме...

×   Вы вставили отформатированный текст.   Удалить форматирование

  Допустимо не более 75 смайлов.

×   Ваша ссылка была автоматически заменена на медиа-контент.   Отображать как ссылку

×   Ваши публикации восстановлены.   Очистить редактор

×   Вы не можете вставить изображения напрямую. Загрузите или вставьте изображения по ссылке.

Зарузка...
×
×
  • Создать...

Важная информация

Находясь на нашем сайте, вы соглашаетесь на использование файлов cookie, а также с нашим положением о конфиденциальности Политика конфиденциальности и пользовательским соглашением Условия использования.