Как отменить закрытие magnific popup, если нажать кнопку мыши на попапе, а отпустить за попапом?

Question

[alexw0lfram]

Здравствуйте. в скрипте magnific popup есть странная деталь - он закрывается, если mouseup происходит за областью попапа, на фоне. То есть, к закрытию попапа приведёт обычно выделение текста, если закончить его выделять где-нибудь на оверлее.

Кто-нибудь уже сталкивался с этим багом? Буду благодарен за помощь.

Answer 1

[inkShio]

может это поможет closeOnBgClick: false

Comments

[alexw0lfram]

Спасибо за интерес к вопросу!

В этом случае mousedown тоже перестаёт работать

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

Не знаю, насколько чётко формулирую порядок происходящего, наверное, странно звучит

[inkShio]

Ну тогда можешь попробовать так.

$('.popup').magnificPopup({
  closeOnBgClick: false,
  callbacks: {
    open: function() {
      если mousedown то закрыть
    }
  }
});

[alexw0lfram]

Такой код сработал, спасибо огромное за подсказку!

callbacks: {
	open: function () {
		$(magnificPopup.wrap).on('mousedown', function (e) {
			if (
				!$(magnificPopup.content).is(e.target) &&
				$(magnificPopup.content).has(e.target).length === 0
			) {
				console.log('success!')
				magnificPopup.close()
			}
		})
	},
},

Единственное, что я заметил, что с каждым новым закрытием количество сообщений в консоли об успешной закрытии увеличивается сначала на 2, потом на 3, 4, 5 и т.д.

[slukasan]

моё решение без увеличения количества сообщений в консоли об успешном закрытии. После каждого срабатывания события, оно удаляется с элемента

const contentPopup = document.querySelector('.mfp-wrap') as HTMLElement;

let listener = (e) => {
    if(!e.target.closest('.mfp-content')) {
        $.magnificPopup.close();
        contentPopup.removeEventListener('mousedown', listener, false);
        console.log('success');
    }
}

contentPopup.addEventListener('mousedown', listener, false);