Html 我从另一个模式打开一个引导模式，但我的模式是可滚动的，而不是可滚动的

我使用javascript打开第一个模态，并从另一个模态打开其他模态。 第一模态正常，其他模态也正常工作，但第二模态和第三模态出现问题。问题是，当内容过流时，滚动转到背景模式而不是滚动

给我这个问题的解决方案。 并给出其他创造这种落地风格的方法

<div id="beginnerModal" class="modal fade" data-backdrop="static" data-keyboard="false" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content dealBg">

            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Hey ${memberFirstName}, <small>Update Company Information</small></h4>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="cold-md-3 col-sm-3 col-xs-12">
                        <div id="">
                           <img src="../images/dummyCompanyLogo.png" id="logo" class="img-responsive">
                        </div>
                        <script>
                            function readURL(input) {
                                if (input.files && input.files[0]) {
                                    var reader = new FileReader();

                                    reader.onload = function (e) {
                                        $('#logo')
                                                .attr('src', e.target.result)
                                               /* .width(150)
                                                .height(200);*/
                                    };

                                    reader.readAsDataURL(input.files[0]);
                                }
                            }
                        </script>

                    </div>
                    <div class="cold-md-9 col-sm-9 col-xs-12 form-horizontal form-label-left">
                        <div class="form-group">
                            <label class="col-md-3 col-sm-3 col-xs-12 control-label">Company Logo</label>
                            <div class="col-md-9 col-sm-9 col-xs-12">
                                <input type="file" onchange="readURL(this);" />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 col-sm-3 col-xs-12 control-label">Phone</label>
                            <div class="col-md-9 col-sm-9 col-xs-12">
                                <input type="text" class="form-control"  />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 col-sm-3 col-xs-12 control-label">Location</label>
                            <div class="col-md-9 col-sm-9 col-xs-12">
                                <input type="text" class="form-control" />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 col-sm-3 col-xs-12 control-label">Domain Name</label>
                            <div class="col-md-9 col-sm-9 col-xs-12">
                                <input type="text" class="form-control" />
                            </div>
                        </div>

                    </div>
                </div>

            </div>
            <div class="modal-footer">
                <p class="pull-left">Step 1 of 3</p>
                <button type="button" class="btn btn-primary" data-dismiss="modal" data-toggle="modal"  data-backdrop="static" data-target="#personalInfo" >Save</button>
                <button type="button" class="btn btn-default" data-dismiss="modal" data-toggle="modal"  data-backdrop="static" data-target="#personalInfo">Skip</button>
            </div>
        </div>
    </div>
</div>

<div id="personalInfo" class="modal fade" data-backdrop="static" data-keyboard="false" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content dealBg">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title"><small>Update Personal Information</small></h4>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="cold-md-3 col-sm-3 col-xs-12">
                        <div id="userImage">
                            <img src="../images/dummyProfilePhoto.jpg" id="userPic" class="img-responsive">
                        </div>
                        <script>
                            function showPic(input) {
                                if (input.files && input.files[0]) {
                                    var reader = new FileReader();

                                    reader.onload = function (e) {
                                        $('#userPic')
                                                .attr('src', e.target.result)
                                        /* .width(150)
                                         .height(200);*/
                                    };

                                    reader.readAsDataURL(input.files[0]);
                                }
                            }
                        </script>

                    </div>
                    <div class="cold-md-9 col-sm-9 col-xs-12 form-horizontal form-label-left">
                        <div class="form-group">
                            <label class="col-md-3 col-sm-3 col-xs-12 control-label">Company Logo</label>
                            <div class="col-md-9 col-sm-9 col-xs-12">
                                <input type="file" onchange="showPic(this);" />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 col-sm-3 col-xs-12 control-label">Phone</label>
                            <div class="col-md-9 col-sm-9 col-xs-12">
                                <input type="text" class="form-control"  />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 col-sm-3 col-xs-12 control-label">Location</label>
                            <div class="col-md-9 col-sm-9 col-xs-12">
                                <input type="text" class="form-control" />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 col-sm-3 col-xs-12 control-label">Domain Name</label>
                            <div class="col-md-9 col-sm-9 col-xs-12">
                                <input type="text" class="form-control" />
                            </div>
                        </div>

                    </div>
                </div>

            </div>
            <div class="modal-footer">
                <p class="pull-left">Step 2 of 3</p>
                <button type="button" class="btn btn-primary" >Save</button>
                <button type="button" class="btn btn-default" data-dismiss="modal" data-toggle="modal"  data-backdrop="static" data-target="#inviteUser">Skip</button>
            </div>
        </div>
    </div>
</div>
<div id="inviteUser" class="modal fade" data-backdrop="static" data-keyboard="false" role="dialog">
    <div class="modal-dialog ">
        <div class="modal-content dealBg">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title"> <small>Invite your colleagues</small></h4>
            </div>
            <div class="modal-body">
                <div class="row" >

                    <div class="cold-md-10 col-sm-10 col-xs-12 form-horizontal form-label-left" id="users">

                        <div class="form-group">
                            <label class="col-md-3 col-sm-3 col-xs-12 control-label">User 1</label>
                            <div class="col-md- col-sm-9 col-xs-12">
                                <input type="email" class="form-control" name="user1" placeholder="Email Address"/>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 col-sm-3 col-xs-12 control-label">User 2</label>
                            <div class="col-md-9 col-sm-9 col-xs-12">
                                <input type="text" class="form-control" name="user2" placeholder="Email Address"/>
                            </div>
                        </div>

                    </div>
                </div>
                <div class="row">
                    <script>
                        $(function(){
                            var user=2;

                            $('#addNewUser').on('click',function(){
                                user++;
                                if(user<=12){
                                var r= $('<div class="form-group"> ' +
                                        '<label class="col-md-3 col-sm-3 col-xs-12 control-label">User ' + user+
                                        ' </label> ' +
                                        '<div class="col-md-9 col-sm-9 col-xs-12">' +
                                        '<input type="text" class="form-control" name=" user'+user+'" placeholder="Email Address"/>' +
                                        '</div></div>');
                                $("#users").append(r);
                                }
                            });
                        });
                    </script>
                    <div class="cold-md-10 col-sm-10 col-xs-12 form-horizontal form-label-left">
                        <div class="form-group">
                            <label class="col-md-3 col-sm-3 col-xs-12 pull-right control-label">
                                <a href="#" id="addNewUser"><i class="fa fa-plus"> </i> Add User</a>
                            </label>
                        </div>
                    </div>
                 </div>

            </div>
            <div class="modal-footer">
                <p class="pull-left">Step 3 of 3</p>
                <button type="button" class="btn btn-primary" >Save</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">Skip</button>
            </div>
        </div>
    </div>
</div>


<script>
    $( document ).ready(function() {
        $('#beginnerModal').modal('show');
    });
</script>**strong text**

&时代；
嘿${memberFirstName}，更新公司信息
函数readURL（输入）{
if（input.files&&input.files[0]）{
var reader=new FileReader（）；
reader.onload=函数（e）{
$（“#徽标”）
.attr（'src'，e.target.result）
/*.宽度（150）
.身高（200）*/
};
reader.readAsDataURL（input.files[0]）；
}
}
公司标志
电话
位置
域名
第1步，共3步
拯救
跳过
&时代；
更新个人资料
函数showPic（输入）{
if（input.files&&input.files[0]）{
var reader=new FileReader（）；
reader.onload=函数（e）{
$（“#userPic”）
.attr（'src'，e.target.result）
/*.宽度（150）
.身高（200）*/
};
reader.readAsDataURL（input.files[0]）；
}
}
公司标志
电话
位置
域名
第2步，共3步
拯救
跳过
&时代；
邀请你的同事
用户1
用户2
$（函数（）{
var用户=2；
$（'#addNewUser'）。在（'click'，function（）上{
用户++；
如果（用户我认为这个家伙和你有同样的问题。如果你的问题是你不能在模式中滚动内容

我认为这家伙和你有同样的问题。如果你的问题是你不能在模式中滚动内容

我已经尝试过这一个，但仍在工作。我正在做与在以下网站中做的相同的事情，并希望制作类似的网站。我很震惊为什么不为我工作。对此我一无所知：（：（请发布完整的代码或一个JSbin/JSFIDLE，因为它更容易重现错误。我已经尝试过这一个，但仍在工作。我正在做与在以下网站中做的相同的事情，并希望制作类似的网站。我很震惊为什么不为我工作。对此我没有任何想法：（：（请发布完整代码或JSbin/JSfiddle，因为这样更容易重现错误。）