2013-12-26 3 views
1

У меня есть приложение jQuery-mobile (1.3.1) + phonegap, в котором я использую всплывающий виджет (это приложение предназначено для Android- любой vresion). Это всплывающее окно для входа (оно имеет имя пользователя, пароль и кнопку «Вход в систему». Всякий раз, когда я нажимаю на текстовое поле (имя пользователя или пароль), клавиатура устройства появляется, но накладывается на всплывающее окно. . это перекрытие, не может видеть то, что они печатают, и не может нажать на Sign-In, если клавиатура не будет минимизирована Вот код, что у меня есть сейчас - я уже использовал «data-position-to="window»jquery mobile popup widget не перемещается, когда активна клавиатура устройства (Android)

<a href="#popupLogin" data-rel="popup" data-position-to="window" data-role="button" data-inline="true" data-icon="check" data-theme="a" data-transition="pop">Done</a> 
      <div data-role="popup" id="popupMenu" data-theme="a" > 
      <div data-role="popup" id="popupLogin" data-overlay-theme="e" data-theme="a" class="ui-corner-all"> 
       <form> 
       <div style="padding:10px 20px;" data-overlay-theme="b"> 
        <h3>Please sign in</h3> 
        <label for="ppcOpremarks" class="ui-hidden-accessible">Remarks</label> 
        <textarea name="ppcOpremarks" id="ppcOpremarks" value="" placeholder="Remarks (if any)" data-theme="a" ></textarea> 
        <label for="un" class="ui-hidden-accessible">Username</label> 
        <input name="user" id="un" value="" placeholder="username" data-theme="a" type="text"> 
        <label for="pw" class="ui-hidden-accessible">Password</label> 
        <input name="pass" id="pw" value="" placeholder="password" data-theme="a" type="password"> 
        <a href="#menuPage"> 
        <button type="submit" data-theme="a" data-icon="check" id="ppCheckDone" onClick="updateppc()">Sign-In</button> 
        </a> </div> 
       </form> 
      </div> 
      </div> 

как чтобы сделать мою всплывающие двигаться в направлении вверх, а не перекрывается с клавиатурой устройства?

ответ

4

Вы можете reposition всплывающие когда поле ввода сфокусированы внутри него.

$("#popupLogin input, #popupLogin textarea").on("focus", function() { 
    $("#popupLogin").popup("reposition", { 
    y: 0 /* move it to top */ 
    }); 
}); 

Demo

Смежные вопросы