0

我正在做一些我需要同时在 jQuery Cycle 中使用 Fullpage.js 的东西。现在我想要发生的是如果我单击带有 jCycle 的导航,则有多个 Fullpage 会滑动。我的 javascript 代码是这样的:

$(document).ready(function() {
        $('#firstpage').fullpage({
            sectionsColor: ['#1bbc9b', '#4BBFC3', '#7BAABE', 'whitesmoke', '#ccddff'],
            scrollingSpeed: 1000
        });

        var titles = ['FirstPage','SecondPage'];
        $('#list') 
            .before('<div id="nav">') 
            .cycle({ 
                fx:     'scrollRight', 
                speed:  'fast', 
                timeout: 0, 
                pager:  '#nav',
                pagerAnchorBuilder: function (index) {
                    return '<a href="#">' + titles[index] + '</a>';
                }
            });
    });

和我的html

<div id="list">
<div>
        <div id="firstpage">
            <div class="section " id="section0">
                <img src="imgs/fullPage.png" alt="fullPage" />
            </div>
            <div class="section" id="section1">
            </div>
            <div class="section" id="section2">
                <div class="intro">
                    <img src="imgs/example2.png" alt="example" />
                </div>
            </div>
            <div class="section" id="section3">
                <div class="intro"></div>
                <img src="imgs/tablets.png" alt="tablets" />
            </div>
        </div>
</div>
<div>
        <div id="secondpage">
            <div class="section" id="section4">
                <img src="imgs/fullPage.png" alt="fullPage" />
            </div>
            <div class="section" id="section5">
            </div>
            <div class="section" id="section6">
                    <img src="imgs/example2.png" alt="example" />
            </div>
        </div>  
</div>

第一页正常工作,但是当尝试导航第二页时滚动不再起作用,但是当我尝试在 javascript 中添加类似这样的内容时,两个页面上的滚动都不起作用。

$('#secondpage').fullpage({
            sectionsColor: ['#1bbc9b', '#4BBFC3', '#7BAABE', 'whitesmoke', '#ccddff'],
            scrollingSpeed: 1000
        });

帮帮我,提前谢谢..

4

0 回答 0