Show Hide информацию о пользователях

[netoya]

Так как у уюзеров достаточно большое количество иформации хочу чтобы она разворачивалась сворачивалась по клику. На подобии того как это выглядит http://www.chinamobil.ru/bb/viewtopic.php?p=524592

Нашел для применения такой скрипт

Код Выделить Развернуть

<script type="text/javascript">
    function showHide(products) {
        var el = document.getElementById('cntnr');
        var children = el.childNodes;
        if (children[products].className == "hide") {
            for(var i=0; i < children.length; i++) {
                children[i].className = 'hide';
            }
            children[products].className = '';
        }
        else {
            children[products].className = 'hide';
        }
    }
</script>

В style.css добавил

Код Выделить Развернуть

.hide {
display:none;
}

в Display.template.php изменил пока часть, чтобы скрывалась информация о постах.

Код Выделить Развернуть


echo '
<div id="cntnr"><div class="hide">

<br/>
', $txt[26], ': ', $message['member']['posts'], '<br />
<br /></div></div>';
echo '
<a href="javascript:showHide('0');">+</a>';

но в итоге вылезает ошибки на строчку <a href="javascript:showHide('0');">+</a>.

Или подскажите как сделать открытие\сворачивание информации пользователя от оффлайн\онлайн до аватарки.

[Drakonsa]

<a href="javascript:showHide(\'0\');">+</a>
Вот так сделайте.

[netoya]

Drakonsa, спасибо.
А теперь как я сделал окончательно:
в index.template.php
добавил строчку

Код Выделить Развернуть

<script language="JavaScript" type="text/javascript" src="', $settings['default_theme_url'], '/click_toggle.js"></script>
сам файл click_toggle.js

Код Выделить Развернуть

function shToggle(content) {
if (document.getElementById(content).style.display == "none")
document.getElementById(content).style.display = "block"
else
document.getElementById(content).style.display = "none"
}

файл надо залить в папку той темы, что назначена по умолчанию.

в Display.template.php
перед началом зоны что я хотел бы скрывать добавил:

Код Выделить Развернуть

echo '
<a href="javascript:void(0);" onclick="shToggle(\'prof' ,$message['counter'], '\'); return false;">+\-</a>
<div id="prof', $message['counter'], '" style="display:none;">';

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

Код Выделить Развернуть

<br />';
поставил

Код Выделить Развернуть

<br /></div>';

Все устраивает и нравится, только хотелось чтобы при нажатии становился -, а при скрытии +
Как это сделать?

Предлагаю перенести тему в полезные решения.

Пришлось каждому <div> устанавливать id по номеру ответа, иначе при нажатии на любой +\- открывался только скрытый текст первого поста страницы.

[Drakonsa]

Добавить <img id="img1" src="картинка">
И

function shToggle(content) {
if (document.getElementById(content).style.display == "none")
{document.getElementById(content).style.display = "block";document.getElementById(img).src='адрес на картинку "-";}
else
{document.getElementById(content).style.display = "none"; document.getElementById(img).src='адрес на картинку "+";'}
}

[netoya]

Drakonsa не могу сделать смену картинки, как не бился не получается, я даже понимаю, что что-то не так сделал, но сам найти проблему не могу.
Теперь код такой:
click_toggle.js

Код Выделить Развернуть


function shToggle(content) {
if (document.getElementById(content).style.display == "none")
{document.getElementById(content).style.display = "block"; document.getElementById(img).src = "/smf/Themes/classic/minus.gif";}
else
{document.getElementById(content).style.display = "none"; document.getElementById(img).src = "/smf/Themes/classic/plus.gif";}
}
Display.template.php

Код Выделить Развернуть


<img id="img" src="/smf/Themes/classic/plus.gif" style="margin-top: 3px;" alt="[Image]"/>
<a href="javascript:void(0);" onclick="shToggle(\'calgary' ,$message['counter'], '\');" style="border-bottom: 1px dashed; cursor: pointer;">Профиль</a>
<br/><br/>
<div id="calgary', $message['counter'], '" style="display:none;">
', $txt[26], ': ', $message['member']['posts'], '<br />
<br /></div>';

При таком варианте картинка + не меняется на минус, я даже думаю, что что-то надо исправить в id="img", но менял на id="calgary', $message['counter'], '", не помогает