Fullpage.js

Question

我想弄清楚如何减小 Fullpage.js 中鼠标滚轮检测到的可滚动区域的宽度，以便我可以添加单独的滚动侧边栏。

Answer 1

您可以使用 fullpage.js 选项 normalScrollElemetns:

$('#fullpage').fullpage({
    sectionsColor: ['yellow', 'orange', '#C0C0C0', '#ADD8E6'],
    scrollOverflow:true,
    normalScrollElements: '#myElement'
});

CSS

#myElement{
    width: 300px;
    height: 400px;
    overflow:scroll;
    background: green;
}

Reproduction online

来自the docs

normalScrollElements: (default null) If you want to avoid the auto scroll when scrolling over some elements, this is the option you need to use. (useful for maps, scrolling divs etc.) It requires a string with the jQuery selectors for those elements. (For example: normalScrollElements: '#element1, .element2')

Fullpage.js - 在滚动区域之外创建侧边栏

Fullpage.js - creating a sidebar outside of scroll area

scrollable