Добрый день, дорогие форумчане
Битый час сижу, и никак не могу понять, как реализовать мою задумку.
У меня на сайте есть несколько диалоговых окон
Всё реализовано так
HTML Код:
<div class="header">
</div>
<div class="wrapper">
<div class="description">
<button class="descr_but"></button>
<div class="description_block" title="Описание 2">
<p>Какой-то текст 2</p>
</div>
</div>
<div class="description">
<button class="descr_but"></button>
<div class="description_block" title="Описание">
<p>Какой-то текст</p>
</div>
</div>
</div>
<div class="footer">
</div>
Код JQ:
$(document).ready(function () {
var dialogBox = $('.description_block').dialog({
autoOpen: false,
show: {
effect: 'blind',
duration: 1000
},
hide: {
effect: 'fold',
duration: 1000
}
});
$('.descr_but').click(function () {
dialogBox.eq($(this).index('.descr_but')).dialog('open');
});
Мне нужно, чтобы диалоговое окно ".description_block" закрывалось при нажатии на любую область вне его.
Я пробовал делать так:
$("body").not(".description").not(".descr_but").not(".description_block").click(function(){
$(".description_block").dialog("close");
});
Но когда я нажимаю на кнопку ".descr_but" после появления диалоговое окно сразу же закрывается.
Помогите пожалуйста советом
Заранее спасибо.