Geek Answers Handbook

Android - keyboard input field - even in Chrome browser

Is there an HTML5 css / js solution to increase the contents of a window when a soft keyboard appears?

For example, if you open duckduckgo.com on an Android device and enter text in the input field when a soft keyboard appears, it hits the content, so it does not apply to the input field.

Compare this to shouttag.com , where the keyboard covers half of the input field.

This happens in our own webview application, but it also happens when viewing a site through chrome.

Update 1:

It seems that fullpage.js api might be the culprit by digging more.

+1
source share
1 answer

Well, here is how I fixed the problem, it is obvious that the html bindings are specific to my sitch, so you can change as needed, important material is in focus / blur anon fxs.

var $fpContainerWrap = jQuery('.home-wrap .fp-tableCell div'); var $homeWrap = jQuery('.home-wrap'); var topOffsetRaw = $fpContainerWrap.offset().top - jQuery(window).scrollTop(); var topOffset = '-' + (topOffsetRaw * 1.5) + 'px'; $('input').focus(function() { $("#menu").animate({ top:topOffset }, "fast"); $homeWrap.animate({ top:topOffset }, "fast"); $('#section-changer').hide(); }); $('input').blur(function() { $("#menu").animate({ top:0 }, "fast"); $homeWrap.animate({ top:0 }, "fast"); $('#section-changer').show(); });
+1
source

More articles:


All Articles