fullPage.js 只显示第一页 - 隐藏除第一页以外的所有页面。为什么？

Question

开发站点，当我使用 fullPage js 时，我只能看到第一页。链接位于开发站点的正确位置。我目前必须禁用整页才能在网站上完成任何工作。我想在开发结束时拥有该功能，但可能只需要一个普通的滚动...

<script src="https://cdn.jsdelivr.net/jquery.fullpage/2.5.9/jquery.fullPage.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/jquery.fullpage/2.5.9/jquery.fullPage.min.css">
<body id='fullpage'>
    <div class='section'>
        <nav>
            <div id="logo"></div>
            <div id='menu'>
                <p><a href="">Home</a></p>
                <p><a href="">Resources</a></p>
                <p><a href="">About</a></p>
                <p><a href="">Contact</a></p>
                <p><a href="">Books</a></p>
                <p><a href="">Blog</a></p>
            </div>
            <div id='social'>
                <a href="https://www.facebook.com/SATPrepGet800"><img src="img/facebookIcon.png"></a>
                <a href="https://twitter.com/satprepget800"><img src="img/twitterIcon.png"></a>
                <img id='share' src="img/shareIcon.png">
            </div>
        </nav>
        <div id='bookPromotion'>
            <div id='bookStack'></div>
                <div id='bookStackText'>
                    <h2>College is expensive.<br> Your books don't have to be.</h2>
                    <h1>Get 7 books for the price of 2</h1>
                    <div>
                        <p>28 SAT Math Lessons - Beginner</p>
                        <p>28 SAT Math Lessons - Intermediate</p>
                        <p>28 SAT Math Lessons - Advanced</p>
                        <p>320 SAT Math Problems</p>
                        <p>32 Most Effective Math Strategies</p>
                        <p>SAT Math Study Guide Companion</p>
                        <p>New Math Problems - Revised SAT</p>
                    </div>
                    <button>Get my books now</button>
                </div>
            </div>
            <div id="bookSlider">
                <div id="sliderCatBtn">
                    <p id='SAT'>SAT</p>
                    <p id='ACT'>ACT</p>
                    <p id='AP'>AP</p>
                    <p id='Other'>Other</p>
                </div>
                <div id="sliderNextBtn"></div>
            </div>
        </div>
        <div class='section'>
            <div id='newsletterTexts'></div>
                <p id='newsletterHeadline'>GET 800 Newsletter</p>
                <form id='newsletterBanner'>
                    <div class='left'>
                        <p>Tips and strategies delivered right to your email</p>
                        <input type='email' placeholder='Type Email Here'>
                    </div>
                    <div class='right'>
                        <div></div>
                        <input type='submit' value='Join'>
                    </div>
                </form>
            </div>
            <div id='resources' class='section'>
                <h1>Learning made easy with these free resources</h1>
                <div class="colWrap">
                    <div id='lImg'></div>
                    <div id='centerCol'>
                        <div class="resource">
                            <img src="img/iconDiploma.jpg">
                            <h3>SAT Math Prep Course</h3>
                            <h4>This 12 part SAT math prep course has in-depth solutions to all math questions from Test 1 of the Official SAT Study Guide</h4>
                        </div>
                        <div class="resource">
                            <img src="img/iconVideo.jpg">
                            <h3>Videos</h3>
                            <h4>Our videos show you how to do your best on your next test</h4>
                        </div>
                        <div class="resource">
                            <img src="img/iconArticle.jpg">
                            <h3>Articles</h3>
                            <h4>Our articles are written to help you do your best on your next test</h4>
                        </div>
                        <div class="resource">
                            <img src="img/iconForum.jpg">
                            <h3>Forum</h3>
                            <h4>Come join in on the discussion. Ask your SAT, ACT, or SAT Subject Test questions now</h4>
                        </div>
                    </div>
                    <div id='rImg'></div>
                </div>
            </div>
            <div class='section'>
                <p id='aboutHeadline'>About Get 800 and Dr. Steve Warner</p>
                <div id="aboutCol">
                    <img src="img/steve.jpg">
                </div>
                <div id='aboutBtn'></div>
            </div>
            <div class='section'>
                <div id='contactBg'>
                    <form type=POST>
                        <input type='text' placeholder='Message Here'>
                        <input type'text' placeholder='Your Name Here'>
                        <input type'email' placeholder='Your Email Here'>
                    </form>
                </div>
                <footer>Copywright 2-15 Get 800 All Rights Reserved</footer>
            </div>
    </body>

Answer 1

Fullpage.js 不能将 body 作为包装器。

变化：

<body id='fullpage'>
    YOUR SECTIONS HERE
</body>

对于

<body>
    <div id='fullpage'>
         YOUR SECTIONS HERE
    </div>
</body>

您可以在 the documentation 中找到它：

Sections should be placed inside a wrapper ( in this case). The wrapper can not be the body element.

fullPage.js 只显示第一页 - 隐藏除第一页以外的所有页面。为什么？

fullPage.js only shows first page - hides every page but the first. Why?

html

javascript

jquery

fullpage.js