【问题标题】:Scrollbar on active slide for overflowing content with Fullpage.js活动幻灯片上的滚动条,用于使用 Fullpage.js 溢出内容
【发布时间】:2014-02-16 22:47:06
【问题描述】:

我正在使用 Fullpage.js 并尝试使其与 wordpress 一起使用,并且它正在向前发展。但是,我试图弄清楚如何能够滚动内容高于活动幻灯片的幻灯片。该插件带有滚动溢出功能,但是该插件会创建一个滚动条,可以滚动浏览您的内容,并继续转到下一张幻灯片。

理想情况下,在当前幻灯片处停止的恒定滚动条对我来说是最佳选择,但我不知道这是否可能。

一直在摆弄这个问题,所以如果有人对如何解决这个问题有任何想法,我将不胜感激。我的网站:

http://www.svenssonsbild.se/Fullscreen/

编辑:意识到我想要的应该能够通过在插件设置中设置 scrolloverflow: true 来实现。只是没有意识到它对我不起作用。

所以,如果有人知道为什么它对我不起作用,那就太好了。我怀疑它与将脚本硬编码在标题中并且没有排队,我无法弄清楚如何去做,因为脚本创建重复的超级容器。

无论如何,任何指针都会非常受欢迎。

【问题讨论】:

    标签: javascript jquery css fullpage.js


    【解决方案1】:

    我自己为此苦苦挣扎,然后再次阅读文档。这里是它所说的:

    • scrollOverflow:(默认false)定义是否创建一个 滚动该部分以防其内容大于高度 其中。如果将其设置为 true,则需要供应商插件 jquery.slimscroll.min 并且应该在 fullPaje.js 之前加载 插入。例如:
    <script type="text/javascript" src="vendors/jquery.slimscroll.min.js"></script>
    <script type="text/javascript" src="jquery.fullPage.js"></script>
    

    这里的问题是不加载 SlimScroll.js。

    然后相应地设置您的 $.fn.fullpage({ }) 配置。

    $('#fullpage').fullpage({
        scrollOverflow: true
    });
    

    【讨论】:

    • 非常感谢!我花了几个小时试图解决这个问题但没有成功,我已经失去理智了!
    【解决方案2】:

    只是为了添加一些可能对其他人有所帮助的信息,我一直在使用这两个插件(fullpage.js 和 slimscroll.js),但在移动设备上使用它时发现 slimscroll 存在问题(动量和滞后问题)。

    如果内容太长,可以将 scrollOverflow 设置为 false 并将下一位添加到 afterSlideLoad 函数以获得原生滚动:

    $('.slide .active').css('overflow-y','auto');

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多