解决bootstrap中模态框显示后页面抖动的问题

来源：互联网发布：阿里云客服扣分标准编辑：程序博客网时间：2024/06/07 01:42

$(function(){
if($("modal").show()){
$("body").css({"overflow":"hidden","margin-right":"15px;"})
$("modal").css({"overflow":"auto","overflow-y":"scroll;"})
}

})

  (function() {        var Modal = {};//解决Modal弹出时页面左右移动问题        Modal.adjustBody_beforeShow = function(){            var body_scrollHeight = $('body')[0].scrollHeight;            var docHeight = document.documentElement.clientHeight;            if(body_scrollHeight > docHeight){                $('header').css({                    'overflow' : 'hidden',                    'padding-right' : '17px'                });                console.log("1");                $('.modal').css({'overflow-y':'hidden'})            }else{                $('body').css({                    'overflow' : 'auto',                    'margin-right' : '0'                });                console.log("2");                $('.modal').css({'overflow-y':'auto'})            }        }        Modal.adjustBody_afterShow = function(){            var body_scrollHeight = $('body')[0].scrollHeight;            var docHeight = document.documentElement.clientHeight;            if(body_scrollHeight > docHeight){                $('header').css({                    'overflow' : 'hidden',                    'padding-right' : '0'                });                console.log("3");            }else{                $('body').css({                    'overflow' : 'auto',                    'margin-right' : '0'                });                console.log("4");            }        }        $(' .modal').modal('hide');        $('.modal ').on('show.bs.modal', function (event) {            Modal.adjustBody_beforeShow();        });        $('.modal').on('hidden.bs.modal', function (event) {            Modal.adjustBody_afterShow();        });    })();

0 0