Закрытие модального загрузчика с помощью animate.css - PullRequest
Новая
       27

Закрытие модального загрузчика с помощью animate.css

0 голосов
/ 03 марта 2019

Я использую много модальных форм в моем текущем проекте.Я использую библиотеку Animated.css для анимации.- Проблема в том, что я хочу использовать анимацию, когда модальное закрытие.Например: открыть модал = flipInX / закрытие модал = flipOutX

Я видел много этих вопросов, но не могу заставить его работать на меня.Я хочу, чтобы эффект работал на всех моих модах, а не только на одном конкретном. 

 <div class="modal animated flipInX fade modal-fullscreen" id="info" tabindex="-1" role="dialog" aria-labelledby="d01" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="container-fluid">


                    </div>
                </div>
            </div>
        </div>
    </div>

1 Ответ

0 голосов
/ 03 марта 2019 
.modal {
    transiton: opacity 2s;
}

.modal-close {
    opacity: 0;
}

вы можете добавить класс для анимации, когда пользователь закрывает модал. 

getElementById('btn-close-modal').classList.add('modal-close')

, таким образом, модал примет 0 aptitude с анимацией, определенной в классе модального закрытия

...