jquery - 当我专注于弹出窗口内的输入框时，弹出窗口移出手机屏幕

Question

我正在为手机设计一个网站。它包含弹出窗口。当我专注于输入框时，有时会弹出屏幕（从顶部），有时会停留在中间。我第一次为移动设备设计网站。我不知道如何处理它。这是我用来打开弹出窗口的代码。

JS：

$("#voucher").fancybox({
        'titlePosition':'inside',
        'transitionIn':'none',
        'transitionOut':'none'
  });

HTML：

<div class="voch_txt specific_sprite">Got a voucher, <a id="voucher" href="#inline2">apply it here</a></div>
    <div class="hide">
      <form action="" method="get">
        <div id="inline2">
          <h3 class="vocuher_icon">Apply Voucher</h3>
          <div class="lightbox_col">
            <input name="" class="vocuher_input" value="" type="text"
                   placeholder="Enter 16 digit voucher code here" >                    
            <input value="update my cart total"
                   type="button">
          </div>
        </div>
      </form>
    </div>

对于我在头部使用的视口：

<meta name="viewport" content="width=device-width initial-scale=1.0"/>

Answer 1

试试这个视口。设置最大比例和用户可缩放不会缩放和缩放页面。

<meta name="viewport"
    content='width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no' />