07 Тра
Необходимо, что бы при клике на ссылку попеременно раскрывался скрытый текст только этой ссылки, а на всех остальных ссылках раскрытый текст прятался.
Для реализации эффекта раскрывающегося текста при клике на ссылку потребуется достаточно простой Java-скрипт и немного HTML-разметки. В базовой реализации скрытый текст под ссылкой просто появляется, расталкивая текст ссылок выше и ниже, без каких-либо визуальных “украшений”.
Java-скрипт
Скрипт можно встроить прямо в сраницу, но лучше сохранить отдельно, назовем его unwrap_text.js
var show;
function look(type){
param=document.getElementById(type);
if(param.style.display == "none") {
if(show) show.style.display = "none";
param.style.display = "block";
show = param;
} else param.style.display = "none"
}
HTML-разметка
<script src="js/unwrap_text.js"></script>
<h3><a onclick="look('wrap_txt1'); return false;" href="#">Ссылочка 1</a></h3>
<div id="wrap_txt1" style="display:none">
<p>Пример текста для блока 1
<p>Пример текста для блока 1
</div>
<h3><a onclick="look('wrap_txt2'); return false;" href="#">Ссылочка 2</a></h3>
<div id="wrap_txt2" style="display:none">
<p>Пример текста для блока 2
<p>Пример текста для блока 2
</div>
<h3><a onclick="look('wrap_txt3'); return false;" href="#">Ссылочка 3</a></h3>
<div id="wrap_txt3" style="display:none">
<p>Пример текста для блока 3
<p>Пример текста для блока 3
</div>
Теги <h3> можно просто заменить на <div>
Оцените post
Просмотры: 1 954


