A quick way to show images and iframe video in a Magnific Popup Gallery.
jQuery(document).ready(function($) { | |
$('.popup-gallery').magnificPopup({ | |
delegate: 'a', | |
type: 'image', | |
tLoading: 'Loading image #%curr%...', | |
mainClass: 'mfp-img-mobile', | |
gallery: { | |
enabled: true, | |
navigateByImgClick: true, | |
preload: [0,1] // Will preload 0 - before current, and 1 after the current image | |
}, | |
image: { | |
tError: '<a href="%url%">The image #%curr%</a> could not be loaded.', | |
/*titleSrc: function(item) { | |
return item.el.attr('title') + '<small>by Marsel Van Oosten</small>'; | |
}*/ | |
}, | |
callbacks: { | |
elementParse: function(item) { | |
// the class name | |
if(item.el.context.className == 'video-link') { | |
item.type = 'iframe'; | |
} else { | |
item.type = 'image'; | |
} | |
} | |
}, | |
}); | |
}); |
Leave a Reply