Fullpage.js部分内的可滚动div不起作用

时间:2017-04-02 10:51:35

标签: javascript html css fullpage.js slimscroll

我希望在fullpage.js的一部分中有一个可滚动的div但是当我包含map时,我会收到此错误:self

包含scrollOverflow库:

http://jsfiddle.net/97tbk/1827/

我想知道我错过了什么:

scrollOverflow: true

4 个答案:

答案 0 :(得分:1)

您只需使用scrollOverflow:true并添加the fullPage.js docs中详述的scrolloverflow.min.js文件。

  

scrollOverflow :(默认为false)(与IE 8不兼容)定义是否为部分/幻灯片创建滚动,以防其内容大于其高度。设置为true时,您的内容将被插件包装。考虑使用委托或在afterRender回调中加载其他脚本。如果将其设置为true,则需要供应商库scrolloverflow.min.js,并且应该在fullPage.js插件之前加载它。例如:

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

the examples folder in fullPage.js

中有一个示例

答案 1 :(得分:0)

您唯一需要做的就是在您希望能够在整页部分滚动的区域上分配某种选择器

<div id="scroll-area">Some long scrollable content</div>

之后只需向 fullpage.js 添加一个选项

normalScrollElements: '#scroll-area'

这就是你可以在 fullpage.js 部分滚动的所有区域

答案 2 :(得分:-1)

您的问题来自scrollOverflow: true。这可能意味着您缺少slimScroll。您已获得完整的详细信息here

调用未知的内容意味着您在使用时尚未确定所需的对象。使用可能是明智的:

$(document).ready(function(){ /*code*/ });

避免出现问题。虽然它无法解决您当前的问题。

- 编辑bcs为-1 =&GT;仍为我的anser感到骄傲。 #EOF

答案 3 :(得分:-1)

您的标记似乎不是jquery.fullPage.js所期望的。它期望具有类fp-scrollable的元素具有子元素,而在jsfiddle中则不是这样。

如果您移动课程

<div class="section">
    <div class="test fp-scrollable">
    ...

变为

<div class="section fp-scrollable">
    <div class="test">
    ...

你会看到它有效。也许这不是你想要最终得到的标记,也许你想要进一步嵌套.test,但不管怎样,这会让你知道如何解决错误。