简体   繁体   English

scrollOverflow / slimScroll在fullPage.js中无法正常工作

[英]scrollOverflow / slimScroll not working properly in fullPage.js

This is the sequel of this thread. 这是这个帖子的续集。

On one page of the website I'm building for a client, both fullpage navigation and scrolloverflow/slimscroll work fine. 在我为客户构建的网站的一个页面上,全页导航和scrolloverflow / slimscroll都可以正常工作。

On another page, fullpage nav works but the overflow is not scrolling. 在另一页上,fullpage导航工作,但溢出不滚动。 Looks like the two divs with the class .slimScrollDiv and .scrollable are not being created as expected. 看起来像.slimScrollDiv.scrollable类的两个div没有按预期创建。 Here's the jsfiddle ; 这是jsfiddle ; the scrollOverflow is set to true yet the overflow of the second section does not scroll. scrollOverflow设置为true但第二部分的溢出不会滚动。

$.fn.fullpage({
    scrollOverflow: true
});

You are having troubles because the class .infotext wrapping your table is defined with position:absolute . 您遇到了麻烦,因为包装表的类.infotext定义为position:absolute This way the plugin can not detect the height of the section content and therefore I doesn't realize it has to create the scrollbar. 这样插件无法检测到节内容的高度,因此我没有意识到它必须创建滚动条。

Use position:relative instead and the problem will be solved: 使用position:relative来解决问题:

Live demo 现场演示

Using an absolute positioned element doesn't make much sense as it will be relative to the section as if you were using a relative positioned one. 使用绝对定位元素没有太大意义,因为它将相对于该部分,就像您使用相对定位元素一样。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 FullPage.js scrollOverflow无法正确处理加载的内容 - FullPage.js scrollOverflow not working properly with loaded content fullPage.js,background和div无法正常工作 - fullPage.js, background and divs not working properly 使用Fullpage.js和scrolloverflow.js禁用内容链接 - Disabled Content Links with Fullpage.js and scrolloverflow.js 使用Scrolloverflow.js + Fullpage.js包装的内容 - Work with content wrapped with Scrolloverflow.js + Fullpage.js fullpage.js - 在mobile上设置responsiveWidth和scrollOverflow中断页面 - fullpage.js - setting responsiveWidth and scrollOverflow breaks page on mobile 窗口调整大小后,fullpage.js仅会滚动溢出 - fullpage.js will only scrollOverflow after window resize Fullpage.js:我可以使用哪个功能重新启动ScrollOverflow插件? - Fullpage.js: with which function I can restart the ScrollOverflow plugin? fullPage.js,scrollDelay无法正常工作 - fullPage.js, scrollDelay not working 无法在移动设备上使用fullpage.js在scrollable部分下方的overflow:auto元素进行交互,scrollOverflow:true - Can't interact on mobile with overflow:auto element underneath scrollable section using fullpage.js, scrollOverflow:true fullpage.js-如果'scrolloverflow'设置为true,则无法向下滚动到下一部分 - fullpage.js - If 'scrolloverflow' is set to true can't scroll down to the next section
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM