Wenn Sie eine CSS-Animation für das modale Öffnen festlegen, berücksichtigt das Modal diese Animation, aber wenn Sie das Modal schließen, verschwindet es, ohne die Animation zu berücksichtigen.Wie kann ich die Modal-Close-Animation in Bootstrap verlangsamen/steuern?
Ich bin verwirrt, weil die Bootstrap-Dokumente sagen "Dieses Ereignis wird ausgelöst, wenn das Modal vor dem Benutzer ausgeblendet wurde (wartet auf CSS-Übergänge abgeschlossen)." https://getbootstrap.com/docs/4.0/components/modal/
Hier ist ein Beispiel; https://jsfiddle.net/chaz7979/o04pxo88/3/
Beachten Sie, wie das Modal sehr langsam nach unten gleitet, aber sofort verschwindet. Ist das ein Fehler oder fehlt mir etwas CSS?
Fehler oder nicht, gibt es eine Möglichkeit, das Modal zu schließen/zu verlassen, wie es die Seite eingegeben hat?
HTML
<!-- Button trigger modal -->
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModalLong">
Launch demo modal
</button>
<!-- Modal -->
<div class="modal fade" id="exampleModalLong" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitle" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">Modal title</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
CSS
.modal.fade .modal-dialog {
transition: 10s;
}