Как анимировать модальное окно magnificPopup при загрузке страницы?

Question

[maldoff]

В документации magnificPopup есть примеры анимации при вызове модального окна. Но нигде не могу найти пример, как сделать анимацию (например, zoom) появления окна при загрузке страницы. Нашел на форумах несколько отдаленно напоминающих примеров, но не срабатывает. Помогите, пожалуйста! Вот заготовка:

$.magnificPopup.open({
	items: {
	    	src: '#form',
	    	type: 'inline'
	},
	closeBtnInside: true
});

Answer 1

[Сергей Герасимов]

Вешайте событие на загрузку страницы, например, так:

<script>
  function ready() {
    $.magnificPopup.open({
  items: {
      	src: '#form',
      	type: 'inline'
  },
  closeBtnInside: true
});
  }

document.addEventListener("DOMContentLoaded", ready);

Answer 2

[maldoff]

Объясню подробней. Есть примеры анимаций https://codepen.io/dimsemenov/pen/GAIkt
Но здесь окно вызывается: $('#inline-popups').magnificPopup и внутри анимация, а нужно без события клик $.magnificPopup.open
И вот если я по этому примеру пытаюсь повесить анимацию, то не срабатывает почему-то. Видимо методы по-другому нужно указывать?

Answer 3

[Serg Bakay]

вся фишка в классе, на который вешаются css анимации:
mainClass: 'mfp-fade',
можно их кастомизировать