Сообщение от Гробовщик
|
Есть у меня нехитрый код который открывает выпадающий текст при нажатии на ссылку (2 ссылки и более)... Всё работает всё в порядке, но вот мне надо что бы когда я "открываю" следующий выпадающий текст предыдущий закрывался (что бы открыт был только один), что надо вставить в мой код что бы так было, или хотя бы исходник где такое реализовано, а дальше я определюсь
<!DOCTYPE HTML>
<html>
<head>
<meta charset="windows-1251">
<title>Квартира</title>
<script src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script>
$(function() {
$(".btn-slide").click(function() {
$("#panel").slideToggle("slow");
$(this).toggleClass("active"); return false;
});
});
$(function() {
$(".btn-slide2").click(function() {
$("#panel2").slideToggle("slow");
$(this).toggleClass("active"); return false;
});
});
</script>
<style>
#panel {
display: none;
padding: 5px;
width: 400px;
height: 200px;
background: #09F;
color: #FFF;
}
.btn-slide {
background: #CCC;
color: #06F;
}
.active {
background: #FF9;
}
#panel2 {
display: none;
padding: 5px;
width: 400px;
height: 200px;
background: #09F;
color: #FFF;
}
.btn-slide2 {
background: #CCC;
color: #06F;
}
.active {
background: #FF9;
}
</style>
</head>
<body>
<a href="" class="btn-slide">Квартира №1<br></a>
<div id="panel">Выберите действие<br>
<form action="#" method="get" target="_work">
<p id="txt">
<input checked="" type="radio">Аренда (сут.)<br>
<input type="radio"> Аренда (мес.)<br>
<input type="radio"> Продажа<br> <br>
<input value="ок" onclick="#'" type="submit">
<input value="отмена" onclick="#'" type="button"></p></form></div>
<a href="" class="btn-slide2">Квартира №1<br></a>
<div id="panel2">Выберите действие<br>
<form action="#" method="get" target="_work">
<p id="txt">
<input checked="" type="radio">Аренда (сут.)<br>
<input type="radio"> Аренда (мес.)<br>
<input type="radio"> Продажа<br> <br>
<input value="ок" onclick="#'" type="submit">
<input value="отмена" onclick="#'" type="button"></p></form></div>
</body>
</html>
|
<a href="" class="btn-slide" data-section="1">Квартира №1<br></a>
<div id="panel1" class="showhide" style="display:none;">Выберите действие<br>
<form action="#" method="get" target="_work">
<p id="txt">
<input checked="" type="radio">Аренда (сут.)<br>
<input type="radio"> Аренда (мес.)<br>
<input type="radio"> Продажа<br> <br>
<input value="ок" onclick="#'" type="submit">
<input value="отмена" onclick="#'" type="button"></p></form></div>
<a href="" class="btn-slide" data-section="2">Квартира №1<br></a>
<div id="panel2" class="showhide" style="display:none;">Выберите действие<br>
<form action="#" method="get" target="_work">
<p id="txt">
<input checked="" type="radio">Аренда (сут.)<br>
<input type="radio"> Аренда (мес.)<br>
<input type="radio"> Продажа<br> <br>
<input value="ок" onclick="#'" type="submit">
<input value="отмена" onclick="#'" type="button"></p></form></div>
<script>
$(function() {
$(".btn-slide").click(function() {
var data = $(this).data('section');
$(".showhide").hide();
$("#panel"+data).slideToggle("slow");
$("a.btn-slide").removeClass("active");
$(this).toggleClass("active"); return false;
});
});
</script>
Вроде так ))