Javascript-форум - Что делать, чтобы нажав за пределы всплывающего окна оно не закрывалось?

Здравствуйте, нужна помощь. На сайте есть всплывающее окно, мне нужно, чтобы человек не смог закрыть его нажав за пределы этого окна.

;(function() {
    var overlay     = document.getElementById('overlay'),
        mOpen       = document.querySelectorAll('[data-modal]'),
        mClose      = document.querySelectorAll('[data-close]'),
        outer       = document.querySelector('.modal-outer'),
        modals      = document.querySelectorAll('.modal-outer > div'),
        duration    = 400,
        mStatus     = false,
        h           = null;
 
    if (mOpen.length == 0) return;
 
    setTopOuter();
 
    function setTopOuter() {
        outer.style.top = -outer.offsetHeight + 'px';
    }
 
    [].forEach.call(mOpen, function(el) {
        el.addEventListener('click', function(e) {
            var modalId = el.getAttribute('data-modal'),
                modal   = document.getElementById(modalId);
            modalShow(modal);
        });
    });
 
    [].forEach.call(mClose, function(el) {
        el.addEventListener('click', modalClose);
    });
 
    document.addEventListener('keydown', modalClose);
 
    function modalShow(modal) {
        mStatus = true;
        overlay.classList.remove('fadeOut');
        overlay.classList.add('fadeIn');
        modal.style.display = 'block';
 
        var start       = new Date().getTime(),
            startTop    = outer.getBoundingClientRect().top,
            finalTop    = (window.innerHeight - outer.offsetHeight) / 2,
            offset      = outer.offsetHeight + finalTop;
 
        var fn = function() {
            var now     = new Date().getTime() - start,
                currTop = Math.round(startTop + offset * now / duration);
 
            currTop = (currTop > finalTop) ? finalTop : currTop;
            outer.style.top = currTop + 'px';
 
            if (currTop < finalTop) {
                requestAnimationFrame(fn);
            }
        }
        requestAnimationFrame(fn);
        window.addEventListener('resize', setTopOpenOuter);
    }
 
    function modalClose(event) {
        if (mStatus && ( !event.keyCode || event.keyCode === 27 ) ) {
            mStatus = false;
 
            var start       = new Date().getTime(),
                startTop    = outer.getBoundingClientRect().top,
                finalTop    = -outer.offsetHeight,
                offset      = outer.offsetHeight + (window.innerHeight - outer.offsetHeight) / 2;
 
            var fn = function() {
                var now     = new Date().getTime() - start,
                    currTop = Math.round(startTop - offset * now / duration);
 
                currTop = (currTop < finalTop) ? finalTop : currTop;
                outer.style.top = currTop + 'px';
 
                if (currTop > finalTop) {
                    requestAnimationFrame(fn);
                } else {
                    overlay.classList.remove('fadeIn');
                    overlay.classList.add('fadeOut');
                    [].forEach.call(modals, function(modal){
                        modal.removeAttribute('style');
                    });
                }
            }
            requestAnimationFrame(fn);
            window.removeEventListener('resize', setTopOpenOuter);
        }
    }
 
    function setTopOpenOuter() {
        outer.style.top = (window.innerHeight - outer.offsetHeight) / 2 + 'px';
    }
})();
 
 
var win_top = 0;
$(document).ready(function(){
    
    // открываем модальное окно при клике по контенту
    $('#list').click(function(){
        popup_open('#myPopup');
    })
    
// открываем модальное окно через 1,5сек после загрузки страницы
 setTimeout(function() {  
      popup_open('#myPopup');  
        }, 2000);
    
    // Добавляем обработчик закрытия модального окна
    $(document).on('click', '.popup .close, .overflow', function(){
        popup_close()
        return false;
    })
    
})
function popup_open(selector){
    if (selector.length){
        win_top = $(window).scrollTop();
        $('#list').css({
            'position'  : 'fixed',
            'left'      : '0',
            'right'     : '0',
            'top'       : '0',
            // Добавляем смещение, чтобы на фоне была именно та часть, что просмаривал пользователь
            'margin-top': '-'+win_top+'px' 
        })
        $('.overflow,'+selector).fadeIn();
    }
}
function popup_close(){
    $('.overflow, .popup').hide();
    $('#list').css({
        'position'  : 'static',
        'margin-top': '0px'
    })
    // Возвращаем скролл на место
    $(window).scrollTop(win_top);
}

<div class="overflow">
            <!-- Затемнение -->
        </div>
        <div class="popup" id="myPopup">
            <a href="#" class="close"></a>
            <div class="popup_title">Модальное окно</div>
</div>

/*Затемнение */
.overflow{
    background: rgba(0, 0, 0, 0.7);
    position:fixed;
    top: 0px;bottom: 0px;
    left: 0px;right: 0px;
    z-index:100;
    display:none;
}
/* модальное окно */
.popup{
    position:absolute;
    z-index:101;
    background: #ffffff;
    width: 435px;
    min-height: 226px;
    margin-left: -218px;
    padding: 20px;
    top: 10%;
    left: 50%;
    display:none;
    border: 0;
 -webkit-border-radius: 5px;
 -moz-border-radius: 5px; 
 border-radius: 5px;
}
 
.popup .close{
    position:absolute;
    top: 10px;
    right: 10px;
    display:block;
    width: 17px;
    height: 17px;
    opacity: 0.5;
    background: url(../img/close.png) no-repeat center;
    -webkit-transition:opacity 0.5s;
    -moz-transition:opacity 0.5s;
    transition:opacity 0.5s;
}
.popup .close:hover{
    opacity: 0.8;
}