我正在使用fullpageJs https://alvarotrigo.com/fullPage/插件创建我的网页,并尝试制作手风琴FAQ页面。

基本上,手风琴是指https://bootsnipp.com/snippets/QXdqR

问题是手风琴超过页面高度时,滚动条无法正常工作。 (我正在激活“ scrollOverflow”选项)

这是我当前的jQuery:

$(document).ready(function() {
 $('.accordion').find('.accordion-toggle').click(function() {
  $(this).next().slideToggle('600');
 $(".accordion-content").not($(this).next()).slideUp('600');
 });
$('.accordion-toggle').on('click', function() {
 $.fn.fullpage.reBuild();
 $(this).toggleClass('active').siblings().removeClass('active');
 });
});


我刚刚添加了$.fn.fullpage.reBuild();,试图解决该问题。

但是,我仍然坚持以下三个问题。


仅当滚动条最初显示在屏幕上时,它才起作用。 (当“ Q”内容超过屏幕高度时)
打开和关闭答案后,整个手风琴将移至意外位置。
(这种情况发生在最初没有在屏幕上显示滚动条,然后在打开手风琴时超过了它的高度的情况下。(这很难用语言解释,我希望这种解释是合理的……)
似乎添加$.fn.fullpage.reBuild();会使页面加载缓慢。 (尤其是在移动设备上)。有什么办法解决这个问题?


顺便说一句,每次打开和关闭答案后,每次调整浏览器大小时,我都能得到理想的结果。

...而已。
如果有人教我任何建议,我将不胜感激。

最佳答案

尝试这个:

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

10-05 21:07
查看更多