Javascript Boostrap模式显示周围有一个白色框

我有一个动态创建的引导模式

<div class="modal fade" tabindex="-1" role="dialog" id="dialog">
    <div class="modal-content">
        <div class="modal-header bg-primary">
            Foo
        </div>
        <div class="modal-body">
            Bar
        </div>
        <div class="modal-footer">
        </div>
    </div>
</div>

所以我可以这样称呼它

dialog({
    buttons: {
        Ok: function() { doSomething(); }
    }
});

问题是，

.model.fade

在适当的模式周围显示为一个白色的div，阻止了所有页面的查看

我展示如何创建它的原因是，我在页面中有另一个静态模式，其中包含正确显示的自定义内容

这两种情况下的功能都是一样的，如果我在模式外单击，它就会消失，但这很烦人，我不想破坏一个，让另一个工作

通过请求视口，我没有向模式添加任何自定义css

<meta name="viewport" content="width=1024" />

---

另外，我同时使用IE8和IE11（两者都是相同的）

删除modal上的淡入淡出类。它只能是class=“modal”。IE中不支持类fade。它没有任何更改。我希望我不必在同一个网页上使用modal和jqueryui

<meta name="viewport" content="width=1024" />