멋진 팝업을 사용하여 휴대 기기에서지도를 표시하는 방법은 무엇인가요?

Question

나는지도에 팝업을 표시하는 멋진 팝업 플러그인을 가지고 있지만 모바일 장치에서는 제대로 작동하지 않습니다. 난 내 코드

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

Answer 1

이 시도

$('.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', 
    } 
}); 

Answer 2

에서 Colares의 솔루션은 나를 위해 일한

여기에 구글지도 페이지로 리디렉션 있음을 클릭합니다. 모바일 팝업이 좁은 직사각형 때부터이 그것을 넓은하게, 미디어 쿼리를 추가 :

@media screen and (max-width: 875px) {.mfp-container { 
height: 90%; 
width: 175%; 
left: -37%; }}