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