Плагин FancyBox. Как сделать на мобильной версии чтобы окно не закрывалось при нажатии на свободную область? И можно ли убрать чтобы модальное окно не закрывалось если его тащить вверх/вниз?
-
fancyapps.com/playground/1W2– Алексей Обухов26 фев 2022 в 10:40
-
На это влияет функция shouldClose?– ka1dos26 фев 2022 в 10:53
-
не обязательно ее использовать, она ими приведена для тонкой настройки закрытия. достаточно опции click: false. добавил упрощенный пример в ответ.– Алексей Обухов26 фев 2022 в 11:21
Добавить комментарий
|
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/ui@4.0/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>