Fullpage.js不能在手机上滚动

时间:2013-11-25 12:39:26

标签: jquery iphone scroll fullpage.js

我在我正在处理的网页上安装了jQuery插件fullpage.js,它在我的电脑上工作正常,但页面第二部分的内容太大,无法放在我手机的屏幕上,应该滚动 - 但我无法弄清楚如何做到这一点。我不会假装我对javascript了解很多,所以我有点不知所措,解决方案可能很简单。 在此先感谢您的帮助!

有问题的网页: http://romowind.com/testside/ - 这是头版。

1 个答案:

答案 0 :(得分:1)

您必须使用选项scrollOverflow将其设置为true并在按指定at the documentation加载jquery.slimscroll.min.js文件之前添加依赖项jquery.fullpage.js

下载插件后,javascript jquery.slimscroll.min.js位于vendors文件夹中。

请务必使用最新版本的fullpage.js。

你包含的文件应该是4个(2个jquery库+整页js文件+ fullpage css文件+ slimscroll) 类似的东西:

<link rel="stylesheet" type="text/css" href="jquery.fullPage.css" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>    

<script type="text/javascript" src="vendors/jquery.slimscroll.min.js"></script>
<script type="text/javascript" src="jquery.fullPage.js"></script>

然后,您的初始化应如下所示:

$(document).ready(function () {
    $.fn.fullpage({
        slidesColor: ['#fff', '#fff', '#fff', '#fff', '#fff'],
        anchors: ['firstPage', 'secondPage', '3rdPage', '4thpage', 'lastPage'],
        scrollOverflow: true
    });
});