scrollOverflow не работает в fullPage.js

Недавно я начал использовать fullPage.js для проекта, и я не могу понять, как заставить работать прокрутку переполнения. Последний "раздел" на моей странице работает долго и поэтому нуждается в вертикальной прокрутке.

Вот код, который у меня внутри <head> теги:

<script src="http://code.jquery.com/jquery-1.9.0.min.js"></script>      
    <script type="text/javascript" src="js/jquery.slimscroll.min.js"></script>
    <script type="text/javascript" src="js/jquery.fullPage.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $.fn.fullpage({
                anchors: ['top', 'brand-or-agency', 'contact-us'],
                fixedElements: '#header',
                resize: false,
                scrollOverflow: true,
                css3: true,
                paddingTop: 100,
                loopTop: false
            });
        });
    </script>

Я также использую Bootstrap (включая JS) и jQuery validate.

Есть ли что-то еще, что мне здесь не хватает, чтобы включить эту функцию?

Источник

1 ответ

Есть ли что-то еще, что мне здесь не хватает, чтобы включить эту функцию?

Если я правильно понимаю, все, что вам не хватает, это опция с именем normalScrollElements. Это класс / идентификатор, который вы определяете, а затем добавляете в элемент div.

    $(document).ready(function(){
        $.fn.fullpage({
            anchors: ['top', 'brand-or-agency', 'contact-us'],
            fixedElements: '#header',
            resize: false,
            scrollOverflow: true,
            css3: true,
            paddingTop: 100,
            loopTop: false,
            normalScrollElements: '#element, .element'

        });
    });

HTML

<div class='section element'> This section will scroll vertically </div>

Как вы можете видеть, sectionSelector "section" все еще должен быть применен.

Источник
Другие вопросы по тегам