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' />

当我专注于弹出窗口内的输入框时，弹出窗口移出移动屏幕

1 个答案: