0
Показ, скрытие блока (div) по клику
Иногда в процессе создания сайта возникает ситуация, когда информация должна показываться на странице только после клика по определенному элементу сайта. Например, это может быть форма добавления сообщения в гостевой книге, форма быстрого ответа на форуме и т.д. В этой ситуации к нам на помощь приходит следующий код:
CSS-код:
.headline {
border: 1px solid #000000;
cursor: pointer;
text-align: center;
}
.hidden {
display: none;
border: 1px solid #ff0000;
text-align: center;
margin-top: 2px;
}
JavaScript:
function show(ele) {
var srcElement = document.getElementById(ele);
if(srcElement) {
if(srcElement.style.display == "block") {
srcElement.style.display= 'none';
}
else {
srcElement.style.display='block';
}
}
}
HTML-код:
<div class="headline" onclick="show('cat1')">Заголовок</div>
<div class="hidden" id="cat1">Текст раскрывающегося блока</div>
Пример, того что получится, можно посмотреть здесь.
Работоспособность:
Internet Explorer 8 
Firefox 3.5.4 
Opera 9.64 
Оставьте своё мнение, и о нём узнают миллионы!
Уважаемые пользователи! Для того, чтобы комментировать записи Вы должны ввести своё имя, e-mail и решить простое уравнение. Это сделано для того, чтобы обезопасить блог от спама и спам-ботов.
При оставлении комментария, пожалуйста, воздержитесь от написания ссылок на сторонние ресурсы. Все комментарии фильтруются как плагинами так и вручную. Не тратьте своё и моё время.
Спасибо за понимание!
При оставлении комментария, пожалуйста, воздержитесь от написания ссылок на сторонние ресурсы. Все комментарии фильтруются как плагинами так и вручную. Не тратьте своё и моё время.
Спасибо за понимание!