Android HTML5 - soft keyboard overlaps input field

Question

I\'m a bit tired looking for a solution for overlapping input field by soft keyboard on Android. My problem is very similiar to this one: Soft Keyboard Overlapping with EditText

Answer 1

The simplest way to solve this android nasty (and now in ios7 too) is to use the inputs focus and blur events. If you are not using the footer tag just replace it with the class of your footer element.

In jQuery:

$("input").focus(function(){
    $('footer').hide();
});

$("input").blur(function(){
    $('footer').show();
});