diff --git a/MAWPUB/view/html/com/com/com/test.html b/MAWPUB/view/html/com/com/com/test.html
index c3db89c..b06c976 100644
--- a/MAWPUB/view/html/com/com/com/test.html
+++ b/MAWPUB/view/html/com/com/com/test.html
@@ -12,6 +12,13 @@
@@ -151,7 +158,7 @@
-
+
@@ -181,6 +188,8 @@
+
+
@@ -212,11 +221,11 @@
document.querySelector('#text1 > em').innerHTML = nowScrollTop;
document.querySelector('#text2 > em').innerHTML = (nowScrollTop + element.getBoundingClientRect().top) - (document.querySelector('#header').scrollHeight * 2);
document.querySelector('#text3 > em').innerHTML = `window.innerHeight=${window.innerHeight}, document=${document.documentElement.clientHeight}, visualviewport=${window.visualViewport.height}`;
- }, 100);
+ }, 1000);
}
}
-commUiFocusInputText.init();
+/* commUiFocusInputText.init(); */
if ('visualViewport' in window) {
@@ -233,6 +242,59 @@
});
}
+
+let isFocus = false;
+
+// 항목일 있을경우 코드 작동
+if (document.querySelectorAll('input[type="text"], textarea').length > 0) {
+ appendScrollElement();
+
+ // onResize visualViewport
+ visualViewport.addEventListener("resize", handleVisualViewportResize);
+}
+
+function handleVisualViewportResize(event) {
+ triggerKeyboardOpen(event.currentTarget.height);
+}
+
+// make-scrollale 객체 추가
+function appendScrollElement() {
+ const scrollElement = document.createElement('div');
+ scrollElement.setAttribute("id", "make-scrollale");
+ document.querySelector('#wrap').appendChild(scrollElement);
+}
+
+function onFocus() {
+ document.querySelector("#make-scrollale").style.height = "calc(100% + 1px)";
+ document.querySelector('#wrap').style.overflow = "hidden";
+}
+
+function onFocusOut() {
+ document.querySelector("#make-scrollale").style.height = "0";
+ document.querySelector('#wrap').style.overflow = "";
+}
+
+function triggerKeyboardOpen() {
+ if (isFocus) {
+ onFocus();
+ // 키보드를 열어준 객체로 스크롤합니다.
+ scrollToActiveElement();
+ }
+ else {
+ onFocusOut();
+ }
+}
+
+function scrollToActiveElement() {
+ // document.activeElement parent id contain wrap
+ if (document.activeElement.parentElement.id.includes('wrap')) {
+ document.activeElement.parentElement.scrollIntoView(true);
+ }
+ else {
+ document.activeElement.scrollIntoView(true);
+ }
+}
+