Свернуть/развернуть категорию форума

автор katze Февраль 4th 2010, 16:45

Здравствуйте,

существует цель: сделать возможным сворачивать-разворачивать категории на форуме, чтобы громоздкие категории, которые пользователю не нужны, ему не мешали.
Я уверена, что теоретически это осуществимо, так как в форме полного ответа под телом сообщения настройки сворачиваются/разворачиваются именно так, как нужно.
Скрин:

Спойлер:

Я вытащила кусок с кодом от выброса кубиков из шаблона отправки сообщения. Вот он:

Спойлер:

Код::  <div id="rolldice" style="display:{ROLLDICE_CLOSE}"> <table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0"> <tr><th class="thHead"> <table width="100%"><tr> <td width="10"></td><td align="center"><span class="gen"><b>{ROLL_DICE_TITLE}</b></span></td><td width="10"><a href="javascript:ShowHideLayernew('rolldice')"><img src="{TABS_MORE_IMG}" alt="+" align="middle" border="0"></a></td> </tr></table> </th></tr> </table> </div> <div id="rolldice_show" style="display:{ROLLDICE_OPEN}"> <table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0"> <tr><th class="thHead" colspan="2"> <table width="100%"><tr> <td width="10"></td><td align="center"><span class="gen"><b>{ROLL_DICE_TITLE}</b></span></td> <td width="10"><a href="javascript:ShowHideLayernew('rolldice')"> <img src="{TABS_LESS_IMG}" alt="-" align="middle" border="0"></a></td> </tr> </th></tr> </table><tr><td class="row1"> <script type="text/javascript"> //<![CDATA[ function add_dice(dice_number,dice,number) { var content = document.getElementById('post_dice').innerHTML; document.getElementById('dice_to_del').innerHTML = ''; document.getElementById('dice_to_del').id = ''; var new_tr = document.createElement('tr'); new_tr.appendChild(document.createElement('td')); new_tr.firstChild.innerHTML = '<span class="postbody">{ROLL_DICE_TITLE_LOW} #' + (dice_number + 1) + ' : </span><select name="post_dice_' + dice_number + '" id="post_dice_' + dice_number + '" value="' + dice + '">' + content + '</select><span class="postbody"> <label for="nb_rolls">{switch_roll_dice.L_DICE_ROLLS} : </label><input type="text" size="2" maxlength="3" name="nb_rolls_' + dice_number + '" id="nb_rolls" class="post" value="' + number + '" /> <span id="dice_to_del"><a href="javascript:add_dice(' + (dice_number + 1) + ',\'\',1)"><img src="{PATH_IMG_FA}tabs_more.gif" alt="plus" /></a></span></span>'; document.getElementById('list_dice').lastChild.appendChild(new_tr); var select_dice = document.getElementById('post_dice_' + dice_number); if ( dice == '' ) { select_dice.selectedIndex=0; } for ( var i = 1; select_dice.options[i]; i++ ) { select_dice.options[i].selected = ( select_dice.options[i].value == dice ); } } //]]> </script> <label class="gen"> <table style="width:100%" id="list_dice"><tr><td> <span class="postbody">{ROLL_DICE_TITLE_LOW} #1 : </span> <select name="post_dice_0" id="post_dice"> <option value="">-</option>  <option value="{switch_roll_dice.row_replace.DICE_ID}"{switch_roll_dice.row_replace.DICE_SELECTED}>{switch_roll_dice.row_replace.DICE_NAME}</option>  </select> <span class="postbody">  <label for="nb_rolls">{switch_roll_dice.L_DICE_ROLLS} : </label><input type="text" size="2" maxlength="3" name="nb_rolls_0" id="nb_rolls" class="post" value="{switch_roll_dice.S_DICE_ROLLS_VALUE}" />  <span id="dice_to_del"><a href="javascript:add_dice(1,'',1)"><img src="{PATH_IMG_FA}tabs_more.gif" alt="plus" /></a></span> </span> </td></tr> </table> </label></tr> </table><br /><br /> </div> {switch_roll_dice.DICE_SCRIPT}

Есть ли какие-то соображения о том, как это осуществить? Может, какие-то скрипты в помощь?
Заранее спасибо откликнувшимся!