Magnific-popup galery

Magnific-popup Gulery.js

//Плавная Popup-галерея


$('.mfp-galery').each(function(){
		$(this).magnificPopup({
			delegate: 'a',  //По каким тегам перечисление фото
			mainClass: 'mfp-zoom-in',
			type: 'image',
			tLoading: '',
			gallery:{
				enabled:true,
			},
			removalDelay: 300, //Плавность перехода
			callbacks: {
				beforeChange: function() {
					this.items[0].src = this.items[0].src + '?=' + Math.random(); 
				},
				open: function() {
					$.magnificPopup.instance.next = function() {
						var self = this;
						self.wrap.removeClass('mfp-image-loaded');
						setTimeout(function() { $.magnificPopup.proto.next.call(self); }, 120);
					}
					$.magnificPopup.instance.prev = function() {
						var self = this;
						self.wrap.removeClass('mfp-image-loaded');
						setTimeout(function() { $.magnificPopup.proto.prev.call(self); }, 120);
					}
				},
				imageLoadComplete: function() { 
					var self = this;
					setTimeout(function() { self.wrap.addClass('mfp-image-loaded'); }, 16);
				}
			}
		})
	});

Magnific.html

<div class="mfp-galery">

					<a href="img/photos/0.jpg"></a>
					<a href="img/photos/1.jpg"></a>
					<a href="img/photos/2.jpg"></a>
					<a href="img/photos/3.jpg"></a>

				</div>