С помощью jQuery подтвердите и scrollTop, вызывая прокрутку страницы вверх, затем вниз - PullRequest
Новая
       35

С помощью jQuery подтвердите и scrollTop, вызывая прокрутку страницы вверх, затем вниз

0 голосов
/ 14 марта 2019

Я использую библиотеку jQuery-verify в проекте, и при использовании вместе с jQuery animate страница прокручивается вверх, а затем прямо вниз вниз. Вот код: 

$.alert({
    boxWidth: '50%',
    useBootstrap: false,
    title: '<p>Questionnaire Errors Found</p>',
    titleClass: 'alert_title',
    content: "<p class='alert_body'>Errors were found in the submitted questionaire and are highlighted in red\n\nPlease review and correct the missing information</p>",
    buttons:    {
        okay:   {
            text: 'Okay',
            btnClass: 'alert_button',
            action: function()  {

                $('html').animate({
                    scrollTop: $('#voters_guide_form').offset().top
                        }, 500);

                    }
                }
            }
        });

Если я не использую библиотеку подтверждения, поведение будет работать как положено. Также не использование анимации не приводит к прокрутке страницы. Я попытался использовать html, body в animate без изменений, и я переместил код animate в код извещения и за его пределы, но он все еще делает то же самое.

Пролистал их документы и интернет, и я не могу найти ничего подобного.

1 Ответ

0 голосов
/ 14 марта 2019

Вы должны использовать $('body') вместо $('html')

Источник ответа

Поэтому вам нужно изменить код на: 

$.alert({
    boxWidth: '50%',
    useBootstrap: false,
    title: '<p>Questionnaire Errors Found</p>',
    titleClass: 'alert_title',
    content: "<p class='alert_body'>Errors were found in the submitted questionaire and are highlighted in red\n\nPlease review and correct the missing information</p>",
    buttons:    {
        okay:   {
            text: 'Okay',
            btnClass: 'alert_button',
            action: function()  {
                 //Changed to body and added stop
                $('body').stop().animate({
                    scrollTop: $('#voters_guide_form').offset().top
                        }, 500);
                    }
                }
            }
        });

Также рекомендуется остановить анимацию, запущенную в body, перед запуском новой анимации.Вот почему я добавил метод stop().

Обратите внимание: Если вы импортируете этот код через iframe, он не будет работать, потому что с помощью iframe ваша страница теперь будетиметь 2 (или более) тела, и $('body') должен возвращать массив вместо объекта.

...