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.