Bootstrap 3 modal vertical position center

后端 未结 30 1177
天涯浪人
天涯浪人 2020-11-28 00:15

This is a two part question:

  1. How can you position the modal vertically in the center when you don\'t know the exact height of the modal?

  2. Is

30条回答
  •  情深已故
    2020-11-28 01:00

    Found the perfect solution from here

    $(function() {
        function reposition() {
            var modal = $(this),
                dialog = modal.find('.modal-dialog');
            modal.css('display', 'block');
    
            // Dividing by two centers the modal exactly, but dividing by three 
            // or four works better for larger screens.
            dialog.css("margin-top", Math.max(0, ($(window).height() - dialog.height()) / 2));
        }
        // Reposition when a modal is shown
        $('.modal').on('show.bs.modal', reposition);
        // Reposition when the window is resized
        $(window).on('resize', function() {
            $('.modal:visible').each(reposition);
        });
    });
    

提交回复
热议问题