jquery / js / html5 zmienia zawartość strony, gdy klawiatura jest widoczna na urządzeniach mobilnych [duplikat]

Możliwy duplikat:
iPad Web App: wykrywanie wirtualnej klawiatury za pomocą JavaScript w Safari?

Buduję wersję mobilną na stronę internetową i interesuje mnie, czy mogę utworzyć za pomocą jquery / js / html5 lub jakiejkolwiek innej technologii ten sam efekt podziału ekranu, który można uzyskać na aplikacjach mobilnych, gdy widoczna jest wirtualna klawiatura.

Na przykład, jeśli użytkownik wejdzie na moją stronę i kliknie pole tekstowe, zostanie wyświetlona wirtualna klawiatura, a przeglądarka automatycznie powiększy obszar, w którym znajduje się pole tekstu wejściowego.

Chcę zmienić zawartość mojej strony w momencie, gdy wirtualna klawiatura jest widoczna na podstawie nowej rozdzielczości (wysokość ekranu - wysokość klawiatury), przesuwając pole tekstu wejściowego na górze ekranu, a następnie kilka wskazówek w zależności od co użytkownik wprowadza w polu tekstowym.

Oto kilka szkiców, aby zobaczyć, o czym mówię:

To jest widok strony bez klawiatury, wyniki oparte na wyszukiwaniu:

strona z klawiaturą portretową, logo znika, wprowadzanie tekstu przesuwa się na górę i wyświetlane są maksymalnie 4 elementy

strona z klawiaturą poziomą, logo znika, wejście x przesuwa się na górę i jest powiększane, pokazywane są tylko 2 elementy

czy klawiatura jest ukryta, strona powinna przejść do fazy 1.

Mam nadzieję że to pomoże.

questionAnswers(1)

yourAnswerToTheQuestion