본문 바로가기
모바일/CORDOVA

cordova-plugin-ionic-keyboard

by 죠부니 2018. 7. 17.
반응형

cordova-plugin-ionic-keyboard

URL : https://github.com/ionic-team/cordova-plugin-ionic-keyboard


왜쓰나요?

--

form을 만들때 input 이나 textarea에서 이벤트를 캐치하여 해당위치로 이동시킴

내맘대로 개조해서 사용했다.


//키보드 이벤트 추가
window.addEventListener('keyboardDidShow', function(event){
//키보드만큼 여백을주고 해당 이벤트에 포커스를 둔다.
var keyBoardHeightDiv = "<div class='keyBoardHeightDiv' style='height:"+event.keyboardHeight+
"px;width:100%;'></div>";
$(".page-content").eq(0).append(keyBoardHeightDiv);
var container = $(".page-content").eq(0);
var scrollTo = $(".page-content").eq(0).find(":focus").offset().top;
$(".page-content").eq(0).animate({
scrollTop: scrollTo - container.offset().top + container.scrollTop()
});
});

window.addEventListener('keyboardDidHide', function(){
//여백 삭제
$(".page-content").eq(0).find(".keyBoardHeightDiv").remove();
});


반응형

'모바일 > CORDOVA' 카테고리의 다른 글

cordova-plugin-appversion  (0) 2018.09.20
Minimum supported Gradle version is 4.4.  (0) 2018.08.27
cordova-plugin-inappbrowser  (0) 2018.06.29
cordova-plugin-splashscreen  (0) 2018.04.26
카카오톡 공유하기 플러그인관련  (0) 2018.04.24