Форум программистов
 
Контакты: о проблемах с регистрацией, почтой и по другим вопросам пишите сюда - alarforum@yandex.ru, проверяйте папку спам! Обязательно пройдите активизацию e-mail.

Вернуться   Форум программистов > Web > JavaScript, Ajax
Регистрация

Восстановить пароль
Повторная активизация e-mail


Донат для форума - использовать для поднятия настроения себе и модераторам

А ещё здесь можно купить рекламу за 25 тыс руб в месяц! ) пишите сюда - alarforum@yandex.ru

Ответ
 
Опции темы
Старый 09.03.2016, 16:53   #1
AlexBond4
Пользователь
 
Регистрация: 03.03.2016
Сообщений: 18
Репутация: 10
По умолчанию Закрываем попап по оверлею

Подскажите пожалуйста как закрыть попап кликом по оверлею(за пределами окна)? Я сделал по крестику, а вот как по оверлею не пойму. Пробовал через find с добавлением дополнительного дива overlayppclose, но тогда попап закрывался кликая по самому окну.
Код:
<div class="overlayppclose">
   <div class="overlaypp">
      <div class="panelpp">
       <div class="closepp"></div>
        <p>Лайтбокс тест</p>
      </div>
     </div>
    </div>
Мне же надо только по оверлею и по крестику.
Песочница тут http://goo.gl/gJQvSP
AlexBond4 вне форума   Ответить с цитированием
Старый 09.03.2016, 18:26   #2
CodeNOT
Участник клуба
 
Аватар для CodeNOT
 
Регистрация: 08.11.2010
Сообщений: 593
Репутация: 188
По умолчанию

меня разметку так:
Код:
 <div class="overlaypp"></div>
 <div class="panelpp">
       <div class="closepp"></div>
        <p>Лайтбокс тест</p>
   </div>
потом делаем так:
Код:
$(document).ready(function(){
 $('body').on('click','.overlaypp',function(event){
   $('.panelpp').hide();
   return event.preventDefault();
 });

$('body').on('click','.overlaypp',function(event){
   $('.panelpp,.overlaypp').hide();
   return event.preventDefault();
 });

$('body').on('click','.closepp',function(event){
   $('.panelpp,.overlaypp').hide();
   return event.preventDefault();
 });
});
CodeNOT вне форума   Ответить с цитированием
Старый 09.03.2016, 18:35   #3
AlexBond4
Пользователь
 
Регистрация: 03.03.2016
Сообщений: 18
Репутация: 10
По умолчанию

Спасибо за почву для размышлений. Однако как то громоздко...
AlexBond4 вне форума   Ответить с цитированием
Старый 09.03.2016, 19:45   #4
CodeNOT
Участник клуба
 
Аватар для CodeNOT
 
Регистрация: 08.11.2010
Сообщений: 593
Репутация: 188
По умолчанию

ну это на скорую руку, а так, я немного опчетался, код примерно таким будет

Код:
$(document).ready(function(){


$('body').on('click','.overlaypp,.closepp',function(event){
   $('.panelpp,.overlaypp').hide();
   return event.preventDefault();
 });

});
CodeNOT вне форума   Ответить с цитированием
Старый 09.03.2016, 19:46   #5
CodeNOT
Участник клуба
 
Аватар для CodeNOT
 
Регистрация: 08.11.2010
Сообщений: 593
Репутация: 188
По умолчанию

ну или можете сделать вообще обвязку по верх попапа, как плагин например и там уже ивенты слушать что значительно удобнее получается
CodeNOT вне форума   Ответить с цитированием
Ответ

Опции темы

Ваши права в разделе
Вы не можете создавать новые темы
Вы не можете отвечать в темах
Вы не можете прикреплять вложения
Вы не можете редактировать свои сообщения

BB коды Вкл.
Смайлы Вкл.
[IMG] код Вкл.
HTML код Выкл.

Быстрый переход

Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Попап один раз за сессию AlexBond4 JavaScript, Ajax 6 04.03.2016 20:59
Попап - окно не до конца всплывает. Aleskandr Помощь студентам 2 23.11.2014 02:59
попап меню vladislav_m БД в Delphi 4 18.03.2012 11:41
Закрываем потоки Cpluser Общие вопросы .NET 3 13.07.2010 10:16
Попап меню блокируют передачу фокуса на др. компоненты... chandrasecar Общие вопросы Delphi 9 24.03.2010 12:57


05:23.


Powered by vBulletin® Version 3.8.11
Copyright ©2000 - 2019, Jelsoft Enterprises Ltd.