Skip to content

Instantly share code, notes, and snippets.

@thiagoeliasr
Created August 13, 2015 13:27
Show Gist options
  • Star 15 You must be signed in to star a gist
  • Fork 12 You must be signed in to fork a gist
  • Save thiagoeliasr/f5e546407e8db3c8b599 to your computer and use it in GitHub Desktop.
Save thiagoeliasr/f5e546407e8db3c8b599 to your computer and use it in GitHub Desktop.
Adding swipe support to Magnific Popup galleries. (touchSwipe is required: http://labs.rampinteractive.co.uk/touchSwipe/demos/)
(function() {
/* Define a variável que dá swipe no lightbox */
var magnificPopup = $.magnificPopup.instance;
/* Carrega a função quando clica no lightbox (senão não pega a classe utilizada) */
$("a.image-lightbox").click(function(e) {
/* Espera carregar o lightbox */
setTimeout(function() {
/* Swipe para a esquerda - Próximo */
$(".mfp-container").swipe( {
swipeLeft:function(event, direction, distance, duration, fingerCount) {
console.log("swipe right");
magnificPopup.next();
},
/* Swipe para a direita - Anterior */
swipeRight:function(event, direction, distance, duration, fingerCount) {
console.log("swipe left");
magnificPopup.prev();
},
});
}, 500);
});
}).call(this);
@surajgd89
Copy link

not working in mobile devices.

@SGBlanca
Copy link

SGBlanca commented Jan 8, 2021

not working in mobile devices.

Si funciona, quizás debas cambiar variables de CSS o te falte implementar el .js touchSwipe, pero si que funciona.

@andreichayeuski
Copy link

Good solution, thanks!

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