Захлопывающийся при нажатии на кнопку

ЕСТЬ РЕШЕНИЕ ЗАКРЫТО
#1 20 февраля 2013 в 12:45
Приветствую!
Подскажите, пожалуйста, решение:
Есть некий <div>. Изначально при открытии страницы он виден пользователю. Нужно присобачить ему ссылку "Закрыть", чтоб по нажатию на неё он исчезал без следа, и от него оставалась только ссылка "Открыть". Типа, как "Убрать рекламу / Посмотреть рекламу".
Как это сделать только средствами каскадных таблиц, желательно без скриптов и jquery?
Научите, плиз!
З.Ы. Если только на CSS низя, то согласен на скрипты, но это в крайнем случае…
#2 20 февраля 2013 в 13:00
посмотрите это решение htmlbook.ru/blog/delaem-stilnye-knopki
#3 20 февраля 2013 в 13:07
VopisUVD, спасибо за ответ, но вопрос о изменении внешнего вида кнопки не стоит… Меня полностью устраивает её вид, меня не устраивает то, что её здесь вообще не должно быть, здесь должна быть ссылка типа <a href=...>Закрыть</a>. Вполне возможно, что вместо текста я туда потом даже вставлю какой-нибудь рисунок.
#4 20 февраля 2013 в 13:24
Вот как я у себя сделал блок в профиле пользователей Мои друзья ссылки показать и скрыть.Изначально закрыто при нажатии Показать друзей открывается блок друзья и надпись Показать друзей заменяется на Спрятать друзей нажав на нее блок закрывается
  1.  
  2. {if $usr.friends}
  3.  
  4. {literal}
  5. <script type="text/javascript">
  6. $(document).ready(function(){
  7. $('#m-blocks_friend').hide();
  8. $('#show_all_friend').click(function(){
  9. if($("#m-blocks_friend").is(":visible")) {
  10. $('#m-blocks_friend').slideUp(400);
  11. $("#show_all_friend").text("Показать друзей");
  12. } else {
  13. $('#m-blocks_friend').slideDown(400);
  14. $("#show_all_friend").text("Спрятать друзей");
  15. }
  16. return false;
  17. });
  18. });
  19.  
  20. </script>
  21. {/literal}
  22.  
  23.  
  24. <div class="usr_friends_block usr_profile_block">
  25.  
  26. <div class="usr_wall_header" style="margin-bottom: 0;">
  27.  
  28. {if !$myprofile}
  29. {$LANG.USER_FRIENDS}
  30. {else}
  31. {$LANG.MY_FRIENDS}
  32. {/if}
  33. <div class="usr_wall_addlink" style="float:right"><a href="#" id="show_all_friend" class="allPhotoAlbum">Показать друзей</a></div>
  34. </div>
  35. <div id='m-blocks_friend'>
  36.  
  37. {if $usr.friends_total > 6}
  38. <div class="float_bar">
  39. <a href="/users/{$usr.id}/friendlist.html">{$LANG.ALL_FRIENDS}</a> ({$usr.friends_total})
  40. </div>
  41. {/if}
  42. {assign var="col" value="1"}
  43. <table width="" cellpadding="5" cellspacing="0" border="0" class="usr_friends_list" align="left">
  44. {foreach key=tid item=friend from=$usr.friends}
  45. {if $col==1}<tr>{/if}
  46. <td align="center" valign="top">
  47. <div class="usr_friend_cell">
  48. <div align="center"><a class="friend_link" href="{profile_url login=$friend.login}">{$friend.nickname}</a></div>
  49. <div align="center"><a href="{profile_url login=$friend.login}"><img border="0" class="usr_img_small" src="{$friend.avatar}" /></a></div>
  50. <div align="center">{$friend.flogdate}</div>
  51. </div>
  52. </td>
  53.  
  54. {if $col==6} </tr> {assign var="col" value="1"} {else} {math equation="x + 1" x=$col assign="col"} {/if}
  55. {/foreach}
  56. {if $col>1}<td colspan="{math equation="x - 6 + 1" x=$col}">&nbsp;</td></tr>{/if}
  57. </table>
  58. </div>
  59. </div>
  60. {/if}
  61.  
#5 20 февраля 2013 в 13:25
Вот примерно так надо:

#6 20 февраля 2013 в 13:51
  1.  
  2. <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;">
  3. <div class="quote">
  4. Ура-а-а-а-а-а!!!
  5. <div>
  6. <br>
  7. <a class="noun" href="javascript://" onclick="getElementById('man1').style.display='none';getElementById('aman1').style.display=''; "><center><b>[Закрыть]</b></center></a> </span>
  8. </div></div></div>
  9.  
#7 20 февраля 2013 в 13:55
st.Puh, Ураааааааааа, только он должон быть изначально открыт, а при нажатии закрывацо))))
#8 20 февраля 2013 в 13:57

Вот примерно так надо:

Карагандинец
Я же вам дал пример кода такое зделано с блоком Мои друзья.вот скрины

А вот уже открыто

Выкидайте код тот что относится к моим друзьям вставляйте свое и готово
#9 20 февраля 2013 в 13:59
st.Puh, при всём моём к Вам уважении, оно у Вас изначально закрыто, а мну требуетцо чтоботкрыто)))
#10 20 февраля 2013 в 14:05
Это мне вполне походит
  1. <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;">
  2. <div class="quote">
  3. Ура-а-а-а-а-а!!!
  4. <div>
  5. <br>
  6. <a class="noun" href="javascript://" onclick="getElementById('man1').style.display='none';getElementById('aman1').style.display=''; "><center><b>[Закрыть]</b></center></a> </span>
  7. </div></div></div>
Только как теперь сделать, чтобы блок был изначально виден, а закрывался только при нажатии? Т.е., всё как в скрипте, только наоборот?))))
#11 20 февраля 2013 в 14:15
Тогда так
  1.  
  2. <div id="man1" >
  3. <div class="quote">
  4. Ура-а-а-а-а-а!!!
  5. <div>
  6. <br>
  7. <a class="noun" href="javascript://" onclick="getElementById('man1').style.display='none';getElementById('aman1').style.display=''; "><center><b>[Закрыть]</b></center></a> </span>
  8. </div></div></div>
  9.  
#12 20 февраля 2013 в 14:18
st.Puh, вот теперь УРААА danceспасибо огромное!!!
#13 20 февраля 2013 в 14:19
ой, забыл! проблема решена…
Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.