Захлопывающийся при нажатии на кнопку
Подскажите, пожалуйста, решение:
Есть некий <div>. Изначально при открытии страницы он виден пользователю. Нужно присобачить ему ссылку "Закрыть", чтоб по нажатию на неё он исчезал без следа, и от него оставалась только ссылка "Открыть". Типа, как "Убрать рекламу / Посмотреть рекламу".
Как это сделать только средствами каскадных таблиц, желательно без скриптов и jquery?
Научите, плиз!
З.Ы. Если только на CSS низя, то согласен на скрипты, но это в крайнем случае…
{if $usr.friends} {literal} <script type="text/javascript"> $(document).ready(function(){ $('#m-blocks_friend').hide(); $('#show_all_friend').click(function(){ if($("#m-blocks_friend").is(":visible")) { $('#m-blocks_friend').slideUp(400); $("#show_all_friend").text("Показать друзей"); } else { $('#m-blocks_friend').slideDown(400); $("#show_all_friend").text("Спрятать друзей"); } return false; }); }); </script> {/literal} <div class="usr_friends_block usr_profile_block"> <div class="usr_wall_header" style="margin-bottom: 0;"> {if !$myprofile} {$LANG.USER_FRIENDS} {else} {$LANG.MY_FRIENDS} {/if} <div class="usr_wall_addlink" style="float:right"><a href="#" id="show_all_friend" class="allPhotoAlbum">Показать друзей</a></div> </div> <div id='m-blocks_friend'> {if $usr.friends_total > 6} <div class="float_bar"> <a href="/users/{$usr.id}/friendlist.html">{$LANG.ALL_FRIENDS}</a> ({$usr.friends_total}) </div> {/if} {assign var="col" value="1"} <table width="" cellpadding="5" cellspacing="0" border="0" class="usr_friends_list" align="left"> {if $col==1}<tr>{/if} <td align="center" valign="top"> <div class="usr_friend_cell"> <div align="center"><a class="friend_link" href="{profile_url login=$friend.login}">{$friend.nickname}</a></div> <div align="center"><a href="{profile_url login=$friend.login}"><img border="0" class="usr_img_small" src="{$friend.avatar}" /></a></div> <div align="center">{$friend.flogdate}</div> </div> </td> {if $col==6} </tr> {assign var="col" value="1"} {else} {math equation="x + 1" x=$col assign="col"} {/if} {/foreach} {if $col>1}<td colspan="{math equation="x - 6 + 1" x=$col}"> </td></tr>{/if} </table> </div> </div> {/if}
<a class="noun" id="aman1" href="javascript://" onclick="getElementById('man1').style.display='';this.style.display='none';"><center><b>[открыть]</b></center></a><div id="man1" style=" display: none;"> <div class="quote"> Ура-а-а-а-а-а!!! <div> <br> <a class="noun" href="javascript://" onclick="getElementById('man1').style.display='none';getElementById('aman1').style.display=''; "><center><b>[Закрыть]</b></center></a> </span> </div></div></div>
Я же вам дал пример кода такое зделано с блоком Мои друзья.вот скриныВот примерно так надо:
А вот уже открыто
Выкидайте код тот что относится к моим друзьям вставляйте свое и готово
<a class="noun" id="aman1" href="javascript://" onclick="getElementById('man1').style.display='';this.style.display='none';"><center><b>[открыть]</b></center></a><div id="man1" style=" display: none;"> <div class="quote"> Ура-а-а-а-а-а!!! <div> <br> <a class="noun" href="javascript://" onclick="getElementById('man1').style.display='none';getElementById('aman1').style.display=''; "><center><b>[Закрыть]</b></center></a> </span> </div></div></div>
<div id="man1" > <div class="quote"> Ура-а-а-а-а-а!!! <div> <br> <a class="noun" href="javascript://" onclick="getElementById('man1').style.display='none';getElementById('aman1').style.display=''; "><center><b>[Закрыть]</b></center></a> </span> </div></div></div>