Skip to content

Instantly share code, notes, and snippets.

@ihorduchenko
Last active December 11, 2023 17:54
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ihorduchenko/58f5708e5f11c31794530891dc8e4e54 to your computer and use it in GitHub Desktop.
Save ihorduchenko/58f5708e5f11c31794530891dc8e4e54 to your computer and use it in GitHub Desktop.
Get instance of Swiper from DOM
// This example shows us how to update broken swiper after Fancybox carousel closing
if (typeof fancyboxInit !== undefined) {
// Main approach here is the next row
$.fancybox.defaults.backFocus = false;
let showCaseSlider = $('.showCaseSlider .swiper-container');
$('[data-fancybox]').fancybox({
afterClose: function() {
if (showCaseSlider) {
let showCaseSliderInstance = showCaseSlider[0].swiper;
showCaseSliderInstance.update();
}
}
});
}
@ImKubass
Copy link

ImKubass commented Sep 20, 2023

If you using typescipt. you can do:

import {Swiper} from "swiper/types"

interface SwiperInstance extends HTMLElement {
  swiper?: Swiper
}

...

const swiperElement = document.querySelector<SwiperInstance>(".your-swiper")
swiperElement.swiper?.update()

@ihorduchenko
Copy link
Author

Thanks for the advice @ImKubass

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment