Google Apps Script의 iOS 뷰포트 관련 문제

iOS 기기에 Google Apps 스크립트 HtmlService가 표시되는 방식에 문제가 있음을 발견했습니다. html의 콘텐츠가 뷰포트의 높이보다 큰 경우 iOS 기기는 스크롤을 허용하지 않습니다. 이것을 강제하는 어떤 방법이 있습니까? 다음 코드는 iOS 기기에서 문제를 재현합니다.Google Apps Script의 iOS 뷰포트 관련 문제

function doGet() { 
    return HtmlService.createTemplateFromFile('html') 
     .evaluate().setSandboxMode(HtmlService.SandboxMode.IFRAME).addMetaTag("viewport", "width=device-width,initial-scale=1").setTitle("Whatever") 

} 


"html" file 

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 

<title>Prep Notes Viewer-Editor</title> 



<link type="text/css" rel="stylesheet" > 

</head> 


<body> 

<div id="output"> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Line <br> 
Last Line 
</div> 

</body> 
</html>

출처

2016-07-07 user2970721

당신은 당신의 스크립트를 게시하고 모든 사람에게 익명 액세스 권한을 부여하고 사람들이 그것을 테스트 할 수 있도록 여기에 등을 게시해야한다. –

여기에 링크가 있습니다. https://script.google.com/d/1j2I3Gr6qXbN5PQjq4tBIb2dex4mVkNRYBLf5mLiCWCVlFYi2-MC7QY9Y/edit?usp=sharing – user2970721

나는 길을 찾아 냈습니다.

바로 몸 후 div 요소를 추가 몸 전체의 HTML을 둘러싼, (의이 #backgroundBox를 부르 자), 다음에 그 div 요소의 CSS를 설정 :

#backgroundBox{ 
    height:100%; 
    width:100%; 
    position:absolute; 
    top:0%; 
    left:0%; 
    margin:0px; 
    padding:0px; 
    overflow:scroll; 
}

다시 HTML과 같을 것이다 이 :

"html" file 

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 

<title>Prep Notes Viewer-Editor</title> 



<link type="text/css" rel="stylesheet" > 

</head> 


<body> 
<div id="#backgroundBox"> 
    <div id="output"> 
    Line <br> 
    Line <br> 
    MORE LINES 
    </div> 
</div> 
</body>

출처

2016-07-07 10:26:34 user2970721

참고 :이 수정 사항이 적용된 iOS 기기의 관성 스크롤링. -webkit-overflow-scrolling을 추가하면 touch; 문제는 스크롤 할 수없는 곳으로 되돌아갑니다. – user2970721

Google Apps Script의 iOS 뷰포트 관련 문제

답변

관련 문제