jquery - Twitter Bootstrap : modal fade

Question

我的 Twitter Bootstrap 模式有问题...

当我的元素上没有 .fade 类时，它工作正常。一旦我添加它，模式就不会显示。

我将问题追查到这一行，我认为:

doAnimate ?
  this.$backdrop.one(transitionEnd, callback) :
  callback()

doAnimate 是 webkitTransitionEnd，看起来不错。 但我认为 transitionEnd 永远不会被触发，因为我尝试在回调中记录一些内容，但它永远不会被记录。

有什么想法吗？

<小时/>

编辑:一些代码

链接:

<a href="/events/2-fefewfewfe/rsvps" data-backdrop="true" data-controls-modal="event-modal" data-keyboard="true">I'm attending!<span class="ico join"></span></a>

模态(在没有淡入淡出类的情况下工作，当我添加它时不起作用)

<div id="event-modal" class="modal hide fade"></div>

CSS:

.modal.fade {
    -webkit-transition: opacity .3s linear, top .3s ease-out;
    -moz-transition: opacity .3s linear, top .3s ease-out;
    -ms-transition: opacity .3s linear, top .3s ease-out;
    -o-transition: opacity .3s linear, top .3s ease-out;
    transition: opacity .3s linear, top .3s ease-out;
    top: -25%;
}

我错过了什么吗？

Answer 1

尽管已被接受，但此答案中的信息不正确，因此我删除了原始回复以防止混淆。这是 jsFiddle 的淡入淡出工作演示 http://jsfiddle.net/sfWBT/880/

编辑以提供更新的链接，因为以前的 jsFiddle 无法正常工作，并且我无法再在没有代码的情况下添加 jsFiddle。所以这也是代码:

html:

<div id="event-modal" class="modal fade">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <a class="close" href="#">x</a>
        <h3>Modal Heading</h3>
      </div>
      <div class="modal-body">
        <p>Some information</p>
      </div>
      <div class="modal-footer">
        <a class="btn primary" href="#">Primary</a>
        <a class="btn secondary" href="#">Secondary</a>
      </div>
    </div>
  </div>
</div>

js:

$(function() {
  $('#event-modal').modal({
    backdrop: true
  });
});