滚动条"整页js"

时间:2017-07-13 10:50:18

标签: javascript jquery html css

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

手风琴基本上是指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();,尝试解决问题。

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

  1. 仅当滚动条最初显示在屏幕中时才有效。 (当" Q"内容超出屏幕高度时)
  2. 整个手风琴在打开后移动到不可预知的位置。结束答案。 (当滚动条最初没有显示在屏幕上然后超过手风琴打开时的高度时会发生这种情况。(这很难用语言解释,我希望解释有意义......)。
  3. 似乎添加$.fn.fullpage.reBuild();会导致页面加载缓慢。 (特别是在移动设备上)。有什么方法可以解决这个问题吗?
  4. 顺便说一句,每次打开和调整后我都会调整浏览器的大小时,我会得到一个理想的结果。结束答案。

    ......就是这样。 如果有人教我任何建议,我将非常感激。

1 个答案:

答案 0 :(得分:0)

试试这个:

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