Закрыть окно
Здравствуйте!
Подскажите пожалуйста как закрыть попап див, кликнув вне его. Соответственно, если кликаем по нему самому, он закрываться не должен. Я пытался так, но как отфильтровать клик по самому диву не понятно: $(document).click(function(){ $('#popup').fadeOut(); }) |
Такой вариантик если попробовать
if ($(this).attr('id') != 'popup') { $(this).fadeOut(); } |
$(document).click(function(e){ var e = e || window.event, x = e.srcElement || e.target; if (x != document.getElementById('popup')) $('#popup').fadeOut(); }) |
exec, спасибо, Ваш вариант работает, но только если всплывающий див пуст. А если он содержит еще элементы и я кликаю по внутреннему содержимому, он все равно закрывается. А хотелось бы, чтобы не закрывался.
|
Решил задачу следующим образом:
(Если у кого то есть более изящное решение, буду рад посмотреть!) $(document).click(function(e){ var e = e || window.event, x = e.srcElement || e.target; var arP = new Array(); var p = $(x).parents(); for(var i=0; i<p.length; i++){ arP[i]=$(p[i]).attr('id'); } arP[p.length]=$(x).attr('id'); if (!inArray(arP, 'popup'))$('#popup').fadeOut(); }); function inArray(mas, element) { for (var i = 0; i < mas.length; i++) { if (mas[i] == element) { return true; } } return false; } |
Может проверять елемент является ли он "popup" и спрашивать, нет ли у него родителя с id="popup"
|
Можно попробовать так:
$(document).click(function(e){ var e = e || window.event, x = e.srcElement || e.target; if (x != document.getElementById('popup') || !$(x).parents('#popup').size()) $('#popup').fadeOut(); }); |
Цитата:
if (x != document.getElementById('popup') && !$(x).parents('#popup').size()) $('#popup').fadeOut(); |
Я решал задачу по другому.
При попапе дива - делал еще один блок с шириной и высотой 100%. на этот фоновый блок вешал событие, которое скрывает попап... P.S. я сторонник идеи, чем меньше изворотов - тем стабильнее работает... наверное, вышеизложенные варианты красивее ;) |
А как работает такая запись кода?
var e = e || window.event, x = e.srcElement || e.target; как это элементы сравниваются через или а потом еще присваиваются?:blink: |
TicTac,
e || window.event - возвращается первый операнд, который после приведения к булевому типу === true лучше так var x = e ? e.target : window.event.srcElement |
Можете еще подсказать, почему при открытии окна, выполняется закрытие popup'окна
показал окно подложку $("#popup_bg").show(); $(".popup_wrap").show(); + прибиндил событие $(document).bind("click", close_popup); но оно сразу выполняется будто я использую тригер ( , я ожидаю закрытие окна по клику на документ, и потом можно отбиндить наверно, что я не так делаю? $('a[rel="popup-login"]').bind("click", function(){ $("#popup_bg").show(); $(".popup_wrap").show(); $(document).bind("click", close_popup); }) function close_popup(e){ var e = e || window.event, x = e.srcElement || e.target; if (x != $('.popup_wrap') || !$(x).parents('.popup_wrap').size()){ $('.popup_wrap').fadeOut(); } } |
Цитата:
|
Все круто а как сделать что бы при клике на ссылку попап сначала открывался, а потом уже при клике в любую часть экрана, кроме попапа, закрывался.
У меня был код который открывает но вместе с описанным в теме кодом он что то не так работает :) подскажите вот что у меня было function ololo(ololoN) { var form = "form"+ololoN; var ID = document.getElementById(form); if(ID.style.display === "none") { ID.style.display = "block"; } else { ID.style.display = "none"; } }; $(document).click(function(e){ var e = e || window.event, x = e.srcElement || e.target; if (x != document.getElementById('form1') && !$(x).parents('#form1').size()) $('#form1').fadeOut(); }); |
Часовой пояс GMT +3, время: 01:18. |