Question

出于某种原因，我无法看到我的第二页？请帮忙。我的代码在这里：https://jsbin.com/dapowipize/edit?html,css,js,output

这是实时预览https://output.jsbin.com/dapowipize如果你缩小，你会看到一个文字“嗨”，但由于某种原因，我无法向下滚动到它...

请帮助:(

非常感谢！

肯尼

Answer 1

您的JavaScript将页面视图限制为窗口高度：

var screenHeight = $(window).height();

尝试在CSS中使用视口高度。

JS小提琴：https://jsfiddle.net/ufowjgb7/

CSS：

.site-wrapper {
    position: relative;
    margin-top: 60px;
}

.navbar {
    position: aboslute;
    top: 0;
    width: 100%;
    height: 60px;
    background-color: #ff0000;
    color: #fff;
}

.welcome {
    width: 100%;
    height: 100vh;
    background-color: #d0d0d0;
}

.cover-page1 {
    width: 100%;
    height: 100vh;
    background-color: #00ff00;
    color: #fff;
}

.cover-page2 {
    width: 100%;
    height: 100vh;
    background-color: #0000ff;
    color: #fff;
}

HTML：

<div class="navbar">
    Navbar
</div>

<div class="welcome">
    Welcome area
</div>

<div class="cover-page1">
    Your first cover area
</div>

<div class="cover-page2">
    Your next cover area
</div>

Answer 2

这是您目前的代码：

<div class="navbar navbar-default navbar-fixed-top">
/*everything else*/

在你的第一个容器div之后关闭div，然后你可以到你的hi。

<div class="navbar navbar-default navbar-fixed-top">
    /*First container*/
    <div class="container">
        <div class="navbar-header">
            /*Code that goes inside this div*/
        </div>
    </div>
</div>
<div class="container">
/*Rest of your code*/

这样做的原因是，当你的div打开时，它会使页面的其余部分成为导航的一部分，并且因为导航被固定在顶部，所以没有办法去下来看看页面的其余部分。如果这有帮助，请告诉我。

无法通过Bootstrap（One Pager Landing Page）进入第二页

2 个答案: