how to display map in mobile devices using magnific popup?

i have magnific popup plugin to show map on the popup but its not working properly in mobile devices. if i click on that it redirecting to google map page

Here my code

$('.video, .map-link').magnificPopup({
   type: 'iframe',
   mainClass: 'mfp-fade',
   removalDelay: 160,
   preloader: false,
   fixedContentPos: false
});

Try this,

 $('.video, .map-link').magnificPopup({
     type: 'iframe',
     mainClass: 'mfp-fade',
     removalDelay: 160,
     preloader: false,
     fixedContentPos: false,
     iframe: {
         markup: '<div class="mfp-iframe-scaler">'+
                 '<div class="mfp-close"></div>'+
                 '<iframe class="mfp-iframe" frameborder="0" allowfullscreen></iframe>'+
                 '</div>', 
         patterns: {
             gmaps: {
                 index: '//maps.google.',
                 src: '%id%&output=embed'
             }
         },
         srcAction: 'iframe_src', 
     }
 });