Wie center spin.js spinner in bootstrap 3 modal?

Ich versuche, display-und center-die spin.js spinner in einem Bootstrap 3 modal. Mit dem nachstehenden code ich habe es auf der Arbeit im IE und FF, aber NICHT im Chrome, Safari Desktop -, Chrome -, IOS-Safari IOS.

Das problem scheint verknüpft werden, um die fade-in animation (grauer hintergrund overlay), weil wenn ich die modale Klasse nur "show modal" es funktioniert, aber mit keine fade-in animation natürlich. Sehen Sie diese jsfiddle. Es ist, wenn ich mit "$('#Searching_Modal").modal('show');" dass es nicht funktioniert in einigen Browsern oben beschrieben.

Führen Sie diese jsfiddle auf chrome und firefox und Ihr werdet sehen was ich meine. Weiß jemand, wie man dieses Problem beheben, oder tun Sie es richtig? Ich will die bootstrap-modal fade-in zu arbeiten.

Ich bin mit Bootstrap 3 und spin.js.

<div id="Searching_Modal" class="modal fade" tabindex="-1" role="dialog" data-keyboard="false"
 data-backdrop="static">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header" style="text-align: center">
            <h3>Searching for Seats</h3>
        </div>
        <div class="modal-body">
            <br>
            <br>
            <br>

            <div id="searching_spinner_center" style="position:fixed; left:50%"></div>
            <br>
            <br>
            <br>
        </div>
        <div class="modal-footer" style="text-align: center"></div>
    </div>
</div>

Hier ist die spin.js set-up-code:

var opts = {
  lines: 13, //The number of lines to draw
  length: 20, //The length of each line
  width: 10, //The line thickness
  radius: 30, //The radius of the inner circle
  corners: 1, //Corner roundness (0..1)
  rotate: 0, //The rotation offset
  direction: 1, //1: clockwise, -1: counterclockwise
  color: '#000', //#rgb or #rrggbb or array of colors
  speed: 1, //Rounds per second
  trail: 60, //Afterglow percentage
  shadow: false, //Whether to render a shadow
  hwaccel: false, //Whether to use hardware acceleration
  className: 'spinner', //The CSS class to assign to the spinner
  zIndex: 2e9, //The z-index (defaults to 2000000000)
  top: 'auto', //Top position relative to parent in px
  left:'auto' //Left position relative to parent in px
};
//var target = document.getElementById('center_spinner');
var target = document.getElementById('searching_spinner_center');
var spinner = new Spinner(opts).spin(target);

InformationsquelleAutor der Frage fat fantasma | 2013-09-13