Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Fancybox gallery breaks swiper

Fancybox breaks swiper. Adds offset without visible CSS and DOM changes. To replicate the issue on jsbin (https://output.jsbin.com/jiqucacete) you need:

new Swiper('.swiper-container', {
  slidesPerView: 1
});

1) Press on the swiper slide image 2) Go to next image in fancybox gallery popup 3) Close gallery and there will be slide change in swiper

How does it work? Why there aren't visible any CSS, DOM changes? How to fix?

like image 642
AidOnline01 Avatar asked Jun 16 '19 05:06

AidOnline01


1 Answers

fancybox places focus back on the trigger element after closing the gallery and sometimes carousel/slider scripts are sensitive to this feature. To disable that, set backFocus:false, for example:

$.fancybox.defaults.backFocus = false;
like image 166
Janis Avatar answered Nov 11 '22 21:11

Janis