Phonegap ios fixed input field on virtual keyboard
'm creates a phonegap app with jquery Mobile. in my application, the fixed input field is shown at the top of the virtual keyboard, this works fine in Android, but in IOS, when the virtual keyboard appears, it doesn't work.
my problem is less than this IOS Toolbar Fixed footer breaks into virtual keyboard
Js
header_height = $('.main-header').height();
footer_height = $('.footer').height();
footer_input_height = $('.fixed_bottom').height();
$('.fixed_bottom').css('bottom',footer_height+'px');
$('#messages .ui-panel-wrapper').css('padding-bottom','inherit');
$("input, textarea").blur(function() {
$("[data-role=footer]").show('','',function(){
$('#messages').css('padding-bottom',footer_height+'px');
$('#messages .ui-panel-wrapper').css('padding-bottom','inherit');
$('.fixed_bottom').css('bottom',footer_height+'px');
});
});
$("input, textarea").focus(function() {
$("[data-role=footer]").hide('','',function(){
$('#messages').css('padding-bottom','0px');
$('#messages .ui-panel-wrapper').css('padding-bottom','0px');
$('.fixed_bottom').css('bottom','0px');
});
})
CSS
#messages .fixed {
left: 0;
right: 0;
width: 100%;
position: fixed;
z-index: 1000;
display: block;
}
#messages .fixed_bottom {
bottom: 0px;
}
Screenshot in android
screenshot in Iphone
+3
source to share
No one has answered this question yet
See similar questions:
or similar: