2017-11-16 7 views
0

내 사이트에 팝업이 있습니다. 팝업이 열리면, 나는 화면의 대부분을 차지하기 위해 크기를 조정 :(창) iPad 화면의 .height()

jQuery(window).resize(function() { 
    var windowHeight = jQuery(window).height(); 
    jQuery('#BookingFrame').css('height', windowHeight * 0.9 | 0); 
}); 

문제 : 아이 패드에서 윈도우 뷰포트 과거의 크기를 조정하고 팝업의 하단이 사라집니다. 문자 그대로 iPad에서 양식을 작성하는 방법은 없습니다.

"이유"에 대해 많은 설명을 보았지만 실행 가능한 솔루션을 찾을 수 없었습니다. 이 포럼에서 제안 된 변경 사항으로 인해 다른 장치에서 페이지 나 사이트의 다른 부분이 깨졌습니다.

나는 장치 ($ device == iPad)를 식별하고 windowHeight를 windowHeight * 0.5 또는 비슷한 것으로 변경할 필요가 있다고 생각한다. 이것이 최고의 솔루션입니까? 아니면 더 간단한 것이 있습니까?

답변

0

지원해야하는 브라우저에 따라 px/rem/% 대신 vh units을 사용할 수 있으므로 j 크기로 팝업의 크기를 조정할 필요가 없습니다.

+0

모든 화면에서 작동하지만 URL로 팝업을로드하고 URL이로드되면 페이지가 화면보다 길며 iPad에서만 높이가 조정되므로 (초기 Vh 단위가 재정의 됨) iPad에서) –

+0

후속 조치로 약간 혼란 스럽습니다. 팝업이 iframe입니까? 엘리먼트를 인라인으로 스타일링하고 CSS를 오버라이드하는 js가 있나요? – ivoilic

+0

클릭 한 후로드되는 팝업 안에 iframe이 있습니다. 더 이상 JS가 없습니다. –