Закрытие модального Popup, нажав от него

Question

Я использую этот учебник, чтобы добавить модальное окно:

http://raventools.com/blog/create-a-modal-dialog-using-css-and-javascript/

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

Пользователь сказал мне, чтобы добавить onclick='overlay()' к наложенному DIV как этот <div id="overlay" onclick='overlay()'>

Когда я пытаюсь закрыть модальный, нажав снаружи, если это, она работает, но он также закрывается при нажатии на самом фактическом модальном , который я не хочу, так как это форма регистрации. Так есть ли способ закрыть модальный, щелкнув вне самого реального модала?

Answer 1

Попробуйте это:

$(document).ready(function(){ 
$('#overlay').bind('click', function(event){ 
    if (event.target == $('#overlay').get(0)) 
     overlay(); 
}); 

Answer 2

Вам нужно будет переместить код наложения из модального окна. Отделив это, у вас не будет наложения в качестве родителя окна, и событие click будет срабатывать только на оверлее.

<div id="overlay"> </div> 
<div id="modalWindow"> 
    <p>Content you want the user to see goes here.</p> 
</div>