Twitter Bootstrap模式：如何删除幻灯片效果
有没有办法将Twitter Bootstrap Modal窗口animation从幻灯片放下效果更改为淡入淡出效果或仅显示没有幻灯片？ 我在这里阅读文档：
http://getbootstrap.com/javascript/#modals
但是他们没有提到改变模态体滑动效果的select。
从模态div中取出fade类。
具体而言，更改：
<div class="modal fade hide">
至：
<div class="modal hide">
更新：对于bootstrap3， hide类是不需要的。
引导程序使用的模式使用CSS3来提供效果，可以通过从模块容器div中删除适当的类来删除它们：
<div class="modal hide fade in" id="myModal"> .... </div>
正如你所看到的，这个模式有一个.fade类，这意味着它被设置为淡入和.in ，这意味着它将滑入。所以，只要删除与你想删除的效果相关的类，在你的情况下.in类。
编辑：只是跑了一些testing，似乎并非如此， .in类是由JavaScript添加，虽然你可以修改他的幻灯片行为与CSS像这样：
.modal.fade { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; }
演示
如果你喜欢让模式淡入而不是滑入（为什么它被称为.fade无论如何？），你可以覆盖你的CSS文件中的类或直接在bootstrap.css中用这个：
.modal.fade{ -webkit-transition: opacity .2s linear, none; -moz-transition: opacity .2s linear, none; -ms-transition: opacity .2s linear, none; -o-transition: opacity .2s linear, none; transition: opacity .2s linear, none; top: 50%; }
如果你不想要任何效果，只需从模态类中删除fade类。
我相信这些答案中的大部分是bootstrap 2.我遇到了bootstrap 3的相同问题，并希望分享我的修复。 像我以前的引导2的答案，这仍然会做一个不透明的淡入淡出，但不会做幻灯片转换。
您可以更改modals.less或theme.css文件，具体取决于您的工作stream程。 如果你没有花更多的时间和精力，我会强烈推荐它。
为less，在MODALS.lessfind下面的代码
&.fade .modal-dialog { .translate(0, -25%); .transition-transform(~"0.3s ease-out"); } &.in .modal-dialog { .translate(0, 0)}
然后将-25%更改为0%
或者，如果您只使用CSS，请在theme.cssfind以下theme.css ：
.modal.fade .modal-dialog { -webkit-transform: translate(0, -25%); -ms-transform: translate(0, -25%); transform: translate(0, -25%); -webkit-transition: -webkit-transform 0.3s ease-out; -moz-transition: -moz-transform 0.3s ease-out; -o-transition: -o-transform 0.3s ease-out; transition: transform 0.3s ease-out; }
然后将-25%更改为0% 。
我通过在我自己的LESS样式表中覆盖默认的.modal.fade样式来解决这个问题：
.modal { &.fade { .transition(e('opacity .3s linear')); top: 50%; } &.fade.in { top: 50%; } }
这使淡入/淡出animation保持不变，但消除了向上/向下滑动animation。
我也不喜欢幻灯片效果。 要解决这个问题，你需要做的就是使得.modal.fade和modal.fade.in的top属性相同。 在过渡阶段你也可以把top 0.3s ease-out ，但是把它放进去并不会让人伤心。 我喜欢这种方式，因为淡入/淡出的作用，只是杀死了幻灯片 。
.modal.fade { top: 20%; -webkit-transition: opacity 0.3s linear; -moz-transition: opacity 0.3s linear; -o-transition: opacity 0.3s linear; transition: opacity 0.3s linear; } .modal.fade.in { top: 20%; }
如果你正在寻找引导3答案， 看看这里
我已经find了最好的解决scheme， 删除幻灯片，但离开淡出是通过添加以下CSS在您select的css文件，这是在bootstrap.css后调用
.modal.fade .modal-dialog { -moz-transition: none !important; -o-transition: none !important; -webkit-transition: none !important; transition: none !important; -moz-transform: none !important; -ms-transform: none !important; -o-transform: none !important; -webkit-transform: none !important; transform: none !important; }
你也可以通过简单的删除“top：-25％”来覆盖bootstrap.css。
一旦删除，模式将简单地淡入和淡出幻灯片animation。
我正在使用bootstrap 3和Durandal JS 2模式插件。 这个问题是在谷歌的结果顶部，因为没有上述的答案是为我工作我想我会分享我的解决scheme为未来的访客。
我重写了默认的Bootstrap的Less代码，这个我自己less了：
.modal { &.fade .modal-dialog { .translate(0, 0); .transition-transform(~"none"); } &.in .modal-dialog { .translate(0, 0)} }
这样我只剩下淡入淡出的效果，并没有slideDown。
只要删除淡入淡出类，如果你想在莫代尔上执行更多的animation，只需在你的模态中使用animate.css类。
想要更新这个。 你们大多数人还没有完成这个问题。 我正在使用Bootstrap 3.以上修复没有工作。
删除幻灯片的效果，但保持淡入。我进入引导CSS和（注意到下列select器） – 这解决了这个问题。
.modal.fade .modal-dialog{/*-webkit-transform:translate(0,-25%);-ms-transform:translate(0,-25%);transform:translate(0,-25%);-webkit-transition:-webkit-transform .3s ease-out;-moz-transition:-moz-transform .3s ease-out;-o-transition:-o-transform .3s ease-out;transition:transform .3s ease-out*/} .modal.in .modal-dialog{/*-webkit-transform:translate(0,0);-ms-transform:translate(0,0);transform:translate(0,0)*/}
.modal.fade, .modal.fade .modal-dialog { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; }
下面的CSS适用于我 – 使用Bootstrap 3.你需要在boostrap样式后添加这个CSS –
.modal.fade .modal-dialog{ -webkit-transition-property: transform; -webkit-transition-duration:0 ; transition-property: transform; transition-duration:0 ; } .modal.fade { transition: none; }
问题很明显： 只删除幻灯片：以下是如何在Bootstrap v3中进行更改
在modals.less评论翻译声明：
&.fade .modal-dialog { // .translate(0, -25%);
