Страница мобильного сафари перепродавших после Fast Gallery Swiping and Clocling Modal (Fancybox) ⇐ IOS

[Anonymous]

У меня есть компонент галереи React с использованием Fancybox, который отлично работает во всех браузерах, кроме мобильного сафари. Проблема возникает, когда: < /p>
Пользователь быстро пробирается через фотографии в модале Fancybox < /p>
закрывает модал < /p>
Вся страница повторно используетпользу (вспыхивает) после закрытия < /p>
Вот упрощенная версия моей реализации: < /p>

здесь упрощенная версия: < /p>

.

Код: Выделить всё

useEffect(() => {
const initFancybox = () => {
const isMobile = /iPhone|iPad|iPod/i.test(navigator.userAgent);

Fancybox.bind(document.body, "[data-fancybox]", {
dragToClose: true,
closeButton: "auto",
Images: { zoom: false },
on: {
ready: (fancybox) => {
const instance = fancybox as FancyboxInstance;

if (isMobile) {
let startY = 0;
let isSwiping = false;

instance.container.addEventListener('touchstart', (e) => {
startY = e.touches[0].clientY;
isSwiping = true;
}, { passive: true });

instance.container.addEventListener('touchmove', (e) => {
if (!isSwiping) return;
const diffY = Math.abs(e.touches[0].clientY - startY);
if (diffY > 50) instance.close();
}, { passive: true });
}
},
destroy: () => setTimeout(initFancybox, 100)
}
});
};

initFancybox();
return () => Fancybox.destroy();
}, []);

Что я пробовал:
Добавить предотвращающегося (), чтобы касаться обработчиков
Различные конфигурации слушателя пассив /> React 18 < /p>
next.js 14 < /p>
fancybox 5.0 < /p>
ios 15+ safari < /p>
Подозреваемые проблемы: < /p>
cafe gafice gafice gafice gafive gafive safistring parem Поведение < /p>
Взаимодействие между виртуальным DOM React и Fancybox < /p>
Странная часть заключается в том, что это происходит только после быстрого удара - нормальное использование работает нормально. Любое понимание будет оценено!

Подробнее здесь: https://stackoverflow.com/questions/796 ... modal-fanc