Twitter Bootstrap Modal不会褪色

Question

Twitter Bootstrap Modal不会褪色

Mar*_*ins 4 modal-dialog fade twitter-bootstrap

我有一个非常简单的HTML应该打开一个淡入淡出的模式,但它只显示和隐藏而不淡入或淡出.

这是代码:

<!DOCTYPE html>
<html>
    <head>
        <link type="text/css" rel="stylesheet" href="css/bootstrap.css" />
        <script type="text/javascript" src="jquery.min.js"></script>
        <script type="text/javascript" src="js/bootstrap-modal.js"></script>
    </head>
    <body>
        <div id="myModal" class="modal hide fade">
            <div class="modal-header"><h4>I'm a header</h4></div>
            <div class="modal-body"><p>Hello from the body</p></div>
            <div class="modal-footer">
                <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
                <button class="btn btn-primary">Save changes</button>
            </div>
        </div>

        <a data-toggle="modal" href="#myModal" class="btn btn-primary">Launch Modal</a>
    </body>
</html>

Run Code Online (Sandbox Code Playgroud)

此代码取自Twitter Bootstrap文档.

在jsFiddle这个简单的代码非常棒!但是如果我将上面的代码像.html一样保存在一个包含所有必需文件(.css和.js)的文件夹中,那么modal会以简单的方式打开,而不会褪色!

我究竟做错了什么？

提前致谢.

Answer 1

And*_*ich 7

这是因为模态效果是CSS3效果,你不包括处理它的插件,所以只需bootstrap-transition.js在模态插件之前加载插件,它应该工作.

归档时间：	12 年，11 月前
查看次数：	4456 次
最近记录：	10 年，6 月前