0

I am developing a web app, currently nothing more than Javascript, HTML and CSS. I have a textbox that is near the bottom of the page and when clicked in to bring up the soft keyboard on Android, it shifts the entire page up, outside the viewport, to make visible WHILE entering text on the keyboard. However after, the entire page stays shifted up and cannot be brought back down to it's original position.

It is all client side code so adding any attributes to XML as suggested in previous posts don't seem feasible. Any help is appreciated.

Afs35mm
  • 549
  • 2
  • 8
  • 21
  • You can add the same attributes from code. Which previous posts? – zmbq May 14 '13 at 19:13
  • @zmbq this post suggests upadting the manifest file, of which I am not using: http://stackoverflow.com/questions/11410257/layout-of-the-screen-moves-up-when-keyboard-is-displayed – Afs35mm May 14 '13 at 19:50

1 Answers1

1

The Android keyboard works differently from the iOS keyboard with respect to javascript events. Think of the Android keyboard as sliding up and squeezing the contents of the page. When this happens it normally causes a javascript 'orientationchange' event. If you have a javascript event listener you will be doing things that might not want. One way to work around this is by adjusting your CSS by using @media screen.

@media screen and (max-aspect-ratio: 13/9) {
   // Put your portrait settings here
}

@media screen and (min-aspect-ratio: 13/9) {
   // Put your landscape settings here
}

With iOS, you can think of the keyboard sliding on top of the page which does not cause an 'orientationchange' event.

Ray Jennings
  • 336
  • 2
  • 10