Question

我使用Cordova构建跨平台应用。我使用bootstrap作为我的框架，并且我在使用导航栏遇到了一些麻烦。我没有为它或任何东西使用任何特殊的CSS。这是我的代码：

<div class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="#">Header</a>
    </div>
    <div class="navbar-collapse collapse">
        <ul class="nav navbar-nav">
            <li class="active"><a href="#">Home</a></li>
            <li><a href="#about">Terms & Conditions</a></li>
            <li><a id="logout">Logout</a></li>
        </ul>
    </div>
    <!--/.nav-collapse -->
</div>

以下是我的视口设置，以防万一：

    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=medium-dpi"/>

当显示键盘时（当我在文本字段内时），导航栏会被推高。如果我在键盘打开时单击一个按钮，键盘就会消失，导航栏会在页面中间卡住（我猜测键盘启动时的位置）。我已对其进行了屏幕录制以便更好地解释。它在这里：https://vid.me/zIc

另外，在科尔多瓦，我有＆＃34; DisallowOverscroll = true＆＃34;所以如果没有必要你就不能滚动。如果我将此设置为false，它仍然会发生，但如果我滚动一点点，它会跳到位！

Answer 1

好像它是我的视口设置。我删除了“height = device-height”，它现在似乎正常工作！

Bootstrap Navbar卡在移动设备上

1 个答案: