Получиться: это
Код:
$(function() {
$('.question').toggle(function(){
$(this).siblings(".answer").show();
}, function(){
$('.название класса элемента на который нажимать').siblings(".класс того что будет выводить").hide();
});
});
HTML:
<div id="faq">
<p class="question" id="1">Почему нет авторизации?</p>
<div class="answer">Ответ: Она не готова</div>
</div>
CSS:
<style type="text/css">
.title {color:white;background:#00FFFF;padding:5px;margin-left:20px;text-align:center;font-size:30px;margin: 0 auto;}
body {background:#75af49;margin:0;padding:0;font-size:13px;font-family:Tahoma,Geneva,sans-serif;color:#fff;};
body.div {color:navy;background:#fff;padding:5px;margin-left:20px;}
.div {color:navy;background:#fff;padding:5px;margin-left:20px;text-align:center;font-size:30px;margin: 0 auto}
.auth {color:navy;background:#0ff;padding:5px;margin-left:20px;text-align:center;font-size:30px;margin: 0 auto}
div {color:black;background:#fff;padding:5px;margin-left:20px;text-align:center;font-size:15px;margin: 0 auto}
.img {position:absolute;right:0px}
.stati {position:absolute;right:0px;margin-top:100px}
.img2 {position:absolute;left:50px;down:80px;margin-top:105px;}
.img3 {position:absolute;right:105px;down:80px;margin-top:105px;}
.img4 {position:absolute;left:100px;down:80px;margin-top:3150px;}
.b-popup{
width:100%;
height: 2000px;
background-color: rgba(0,0,0,0.5);
overflow:hidden;
position:fixed;
top:0px;
}
.right {width:250px}
.left {width:150px}
.question {
margin: 0 auto;
font-size: 16px
font-family: Tahoma;
color: #0000FF;
text-decoration: underline;
}
.question:hover {
color: red;
}
.answer {
border:1px solid;
padding:50px;
display:none;
}
</style>
Подключить JQuery:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>