본문 바로가기
코딩/제이쿼리

[부트스트랩] 이중 모달창

by euntori 2017. 7. 24.
반응형

Multiple Modal창 띄울 때 아래 스크립트를 추가한다.

구글에서 찾은 값은 count가 없어서 2개까지만 열 때 가능한 것이고

3중, 4중으로 계속 띄울 때가 있을 것 같아서 소스를 조금 수정함.



//Bootstrap multiple modal

var count = 0; // 모달이 열릴 때 마다 count 해서  z-index값을 높여줌

$(document).on('show.bs.modal', '.modal', function () {

    var zIndex = 1040 + (10 * count);

    $(this).css('z-index', zIndex);

    setTimeout(function() {

        $('.modal-backdrop').not('.modal-stack').css('z-index', zIndex - 1).addClass('modal-stack');

    }, 0);

    count = count + 1

});


// multiple modal Scrollbar fix

$(document).on('hidden.bs.modal', '.modal', function () {

    $('.modal:visible').length && $(document.body).addClass('modal-open');

});

반응형

Designed by 티스토리