0

I have seen many examples on how to get iPhone keyboard popup to change its input form, however I would like to have my input field to be a part of the iPhone keyboard popup

whenever I have an input field then the keyboard pops up and pushes the input field - inorder to have the input field "follow" the keyboard, then it must somehow be "embedded" -- I have seen solutions capable of this, however I have seen no javascript code

Is it possible to use javascript to get an input field to be a part of the keyboard or at least follow it precise ?

serup
  • 527
  • 5
  • 11
  • you can see this answer, it will help you: http://stackoverflow.com/questions/21042126/what-is-best-approach-to-create-customize-keypad/21042580#21042580 – maddy Apr 15 '14 at 14:08
  • Do not really understand that example -- customizing a whole new keyboard layout was not what I was looking for - just adding my own input field to the form or getting my input field to follow layout position of keyboard Also example is not for javascript – serup Apr 15 '14 at 14:12
  • If using phonegap you could use objective-c to create this functionality. If you are looking for a pure js solution it might require some hacking. – Joe Komputer Apr 15 '14 at 16:29
  • I am looking for a pure javascript solution - any suggestions to how this can be done? – serup Apr 24 '14 at 02:22

1 Answers1

1

One way of doing this without dealing with objective-c is to set the inputs styling to scroll up with the keyboard in css. Although its kinda a hacky solution here is what I used to style the input to scroll up with the keyboard:

input{
            position:absolute;
            bottom:-16px;
            width: 100%;
            left:0;
            height: 5%;
            padding:0;
            margin:0;
        }

Since the bottom of the window changes when the keyboard comes up the inputs position will also change with it. You can obviously add to this to make it more fancy, but hopefully you get the idea.

Joe Komputer
  • 1,325
  • 3
  • 12
  • 25
  • sounds like a step in the right direction - I will try it out – serup Apr 24 '14 at 02:23
  • it seems that this works for input field, however if I have an input field inside a div and try to set css proporties for the div section instead, then the result is not as expected. I have a class that transforms the input field size and using your css will alter size of input field – serup Apr 24 '14 at 03:17