Открыть/скрыть блок
Здравствуйте! Помогите пожалуйста разобраться.
Мне нужен простенький блок (<div>), который будет открываться/скрываться (display: block/none; ) при нажатии на ссылку. Желательно помоч реализовать через функцию function showhide(cat), где cat имя CSS класса блока который надо скрыть. Пытался сделать сам, но знаний не хватает. PS: еще раз благодарю. |
<style> #cont h3 { border-width: 2px 2px 0; border-style: solid; border-color: #000; margin-bottom: 0; } #cont div { border-width: 0 2px 2px; border-style: solid; border-color: #000; } #cont.hide div { display: none } #cont.hide h3 {border-bottom-width: 2px} </style> <div id="cont"> <h3>Заголовок</h3> <div>text<br>text<br>text<br>text<br></div> </div> <script> document.getElementById("cont").getElementsByTagName("h3")[0].onclick=function() { this.parentNode.className= this.parentNode.className ? "":"hide"; } </script> Вот так можно, например. |
trikadin,
Пример делает то что нужно, но в моем случае не совсем подходит. Как бы вместо того чтобы класс дописывался, как тут: this.parentNode.className ? "":"hide"; Сделать смену display: none; на display: block; PS: Но за пример спасибо! |
Сам собрал, но только несколько нажатий работает, потом перестает:
<script type="text/javascript"> function showhide(elem) { document.getElementsByClassName(elem)[0].style.display = document.getElementsByClassName(elem)[0].style.display ? 'block':'none'; } </script> <a class="show" style="display: block" onclick="showhide('hide');" href="#">Открыть</a> <div class="hide" style="display: none"> #1234567890# </div> |
Цитата:
document.getElementsByClassName(elem)[0].style.display ? '':'none'; |
trikadin,
Ступил...спасибо что помогли разобраться! |
Часовой пояс GMT +3, время: 08:44. |