繁体   English   中英

使用小型Bootstrap模态的超大背景模态

[英]Extra large background modal using small Bootstrap modal

我遇到了Bootstrap模态的问题,如果我将大小更改为小号,其背后还有一个挥之不去的背景模态,但仍然很大。

在此处输入图片说明

在“元素”窗口中,我可以在uib-modal-transclude之前删除class =“ modal-content”,并且后面的模式消失。 但是,我试图在我的代码中应用此更改,并且无法使其正常工作。

首先,此代码似乎来自uib/template/modal/window.htmlhttps://github.com/angular-ui/bootstrap/blob/master/template/modal/window.html

我正在使用ui_bootstrap / 1.1.2

我试图使用windowtemplateurl覆盖模板,并使新模板具有:

  <div modal-render="true" tabindex="-1" role="dialog" class="modal fade ng-isolate-scope in"
     uib-modal-animation-class="fade" modal-in-class="in" ng-style="{'z-index': 1050 + index*10, display: 'block'}"
     uib-modal-window="modal-window" size="sm" index="0" animate="animate" modal-animation="true"
     style="z-index: 1050; display: block;">
        <div uib-modal-transclude=""><!--

            <!-- Modal -->
            <div class="modal-dialog modal-sm">
                <div class="modal-content modal-sm">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" ng-click="Cancel()"><span
                                aria-hidden="true">×</span>
                            <span class="sr-only">Close</span>
                        </button>
                        <h4 class="modal-title ng-binding" id="notfound"> Not Found</h4>
                    </div>
                    <div class="modal-body">
                        <button type="button" class="btn btn-default" data-dismiss="modal" ng-click="Cancel()">Close
                        </button>
                        <button type="button" class="btn btn-primary">Add New</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

这没用。 似乎根本没有改变windowTemplateUrl改变任何事情...我也尝试过向模式内容添加css,但这在此页面上搞砸了其他模式。

我在正确的轨道上吗? 这个错误来自哪里? 修复它的最佳方法是什么?

万一其他人有此错误,这是我为解决此问题所做的工作。

我的代码中确实找到了一个声明模式大小为“ xl ”的声明。 将其更改为“ sm ”,我的模式周围仍然有一个包装,大小为300x184,而我的模式为300x122。

我取出class="modal-dialog" div包装器,第二个模式消失了。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM