magnific-example.js

  $(".article__body img").magnificPopup({
    type: "image",
    callbacks: {
      elementParse: function(item) {  
        item.src = item.el.context.src;
      }
    },
    closeOnContentClick: true,
    closeBtnInside: false,
    fixedContentPos: true,
    mainClass: "mfp-with-zoom", // class to remove default margin from left and right side
    image: {
      verticalFit: true
    },
    zoom: {
      enabled: true,
      duration: 300 // don't foget to change the duration also in CSS
    }
  });