Как сделать чтобы на мобильной версии FancyBox не закрывался при нажатии на область вокруг модального окна?
Плагин FancyBox. Как сделать на мобильной версии чтобы окно не закрывалось при нажатии на свободную область? И можно ли убрать чтобы модальное окно не закрывалось если его тащить вверх/вниз?
Ответы (1 шт):
Автор решения: Алексей Обухов
→ Ссылка
Немного изменил пример с их сайта:
Fancybox.bind('[data-fancybox="trigger-modal"]', {
closeButton: true,
dragToClose: false,
click: false
});<link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet"/>
<link href="https://cdn.jsdelivr.net/npm/@fancyapps/ui/dist/fancybox.css" rel="stylesheet"/>
<script src="https://cdn.jsdelivr.net/npm/@fancyapps/[email protected]/dist/fancybox.umd.js"></script>
<h1 class="mt-12 mb-8 px-6 text-center text-lg md:text-2xl font-semibold">
Fancybox true modal
</h1>
<p class="text-center">
<a
data-fancybox="trigger-modal"
href="#modal-test"
class="px-6 pt-2 pb-3 text-xl bg-indigo-500 text-white rounded-full font-semibold"
>Click me</a
>
</p>
<div id="modal-test" style="display: none">
<p class="mb-4 text-lg leading-8">
Interdum et malesuada fames a
</p>
</div>