181. (javascript/자바스크립트) onresize 화면 크기 변환 감지 사용해 안드로이드 가상 키보드 활성 상태 체크 실시

---

[개발 환경 설정]

​

개발 툴 : Edit++

개발 언어 : javascript

 

---

[소스 코드]

    <!-- [내부 자바스크립트 J쿼리 이벤트 지정] -->
    <script>


        // [전역 변수 관리] 
        var bodyHeightOriginalSize = "";
        var bodyHeightChangeSize = "";





        // [dom 생성 및 이벤트 상시 대기 실시] 
        document.addEventListener("DOMContentLoaded", ready);
        function ready(){
            console.log("");
            console.log("[window ready] : [start]");
            console.log("");
        }





        // [html 최초 로드 및 이벤트 상시 대기 실시]
        window.onload = function() {
            console.log("");
            console.log("[window onload] : [start]");
            console.log("");


            // [브라우저 초기 로드 시 가상 키보드 비활성 상태 인 Height 값 저장 실시]
            bodyHeightOriginalSize = document.body.clientHeight;
        };





        // [html 화면 사이즈 변경 이벤트 감지] 
        window.onresize = function() {
            console.log("");
            console.log("[window onresize] : [start]");
            console.log("");

            // [실시간 변경 된 Height 값 저장 실시]
            bodyHeightChangeSize = document.body.clientHeight;

            console.log("");
            console.log("[window onresize] : [body 높이 값 확인 실시]");
            console.log("[bodyHeightOriginalSize] : [원본] : " + bodyHeightOriginalSize);
            console.log("[bodyHeightChangeSize] : [변경] : " + bodyHeightChangeSize);
            console.log("");


            // [접속 한 디바이스 확인 실시]
            var uagent = navigator.userAgent.toLowerCase();
            var android_agent = uagent.search("android");
            var iphone = uagent.search("iphone");
            var ipad = uagent.search("ipad");


            // [접속 한 디바이스가 안드로이드 인 경우]
            if (android_agent > -1) {
                // [원본 사이즈와 변화된 사이즈가 같은 경우 : 가상 키보드 비활성 상태]
                if (bodyHeightOriginalSize == bodyHeightChangeSize){ // [원본 사이즈와 변화된 사이즈가 같은 경우 : ]

                    console.log("");
                    console.log("[window onresize] : [가상 키보드 비활성]");
                    console.log("");
                }
                // [원본 사이즈와 변화된 사이즈가 다른 경우 : 가상 키보드 활성 상태]
                else { 

                    console.log("");
                    console.log("[window onresize] : [가상 키보드 활성]");
                    console.log("");

                }
            }
        };



    </script>

---