2015-12-01 4 views
0

У меня есть кнопка «назад к началу», которая появляется на моей веб-странице, над которой я работаю. Когда вы прокручиваете вниз, а иногда, когда его щелкают, он прыгает вверх, а затем возвращается к месту, где вы были на странице, а затем плавно прокручивается вверх, как и предполагалось. Имейте в виду, что он не делает это все время. Будет ли это просто проблемой с задержкой или сбоем или если в моем сценарии есть ошибка?К началу страницы Проблема с кнопкой (потенциально)?

$(function(){ 

    $(document).on('scroll', function(){ 

     if ($(window).scrollTop() > 615) { 
      $('.ion-android-arrow-dropup-circle').addClass('show'); 
     } else { 
      $('.ion-android-arrow-dropup-circle').removeClass('show'); 
     } 
    }); 

    $('.ion-android-arrow-dropup-circle').on('click', scrollToTop); 
}); 

function scrollToTop() { 
    verticalOffset = typeof(verticalOffset) != 'undefined' ? verticalOffset : 0; 
    element = $('body'); 
    offset = element.offset(); 
    offsetTop = offset.top; 
    $('html, body').animate({scrollTop: offsetTop}, 500, 'linear'); 
}; 

Искал 40+ вопросы и не смогли найти ответ. Только говорю это, потому что, если вы этого не делаете, и кто-то находит его, они всегда говорят: «Вы должны были посмотреть, прежде чем спрашивать». Я все время вижу.

ответ

1

ОТВЕТ на мой собственный вопрос

После идти так долго без ответов я перешел и решил не беспокоиться об этой проблеме, в то время. Сегодня я работал на другом сайте, используя тот же сценарий jQuery, и имел ту же проблему. Я решил попробовать и исправить это сам, так как я не мог найти помощь по этому вопросу.

Решение было простым! Я не знаю, как я пропустил это в первый раз. Все, что я сделал, это взять код выше и добавить одну функцию к нему:

$('.ion-android-arrow-dropup-circle').click(function(event) { 
     event.preventDefault() 
    }); 

Я забыл все о необходимости удалить действие по умолчанию, нажав на ссылку, которая прыгает по назначению. Теперь он отлично работает и отлично выглядит, как я и хотел начать!

Мой полностью обновленный скрипт для справки:

$(function(){ 
    $(document).on('scroll', function(){ 

    if ($(window).scrollTop() > 50) { 
     $('.ion-eject').addClass('show'); 
    } else { 
     $('.ion-eject').removeClass('show'); 
    } 
}); 

    $('.ion-eject').click(function(event) { 
      event.preventDefault() 
     }); 
    $('.ion-eject').on('click', scrollToTop); 
}); 

function scrollToTop() { 
    verticalOffset = typeof(verticalOffset) != 'undefined' ? verticalOffset : 0; 
    element = $('body'); 
    offset = element.offset(); 
    offsetTop = offset.top; 
    $('html, body').animate({scrollTop: offsetTop}, 200, 'linear'); 
}; 
Смежные вопросы