jQuery scrollTop() сбрасывает вверх в IE

Я заметил странное поведение при использовании jquery scrollTop в IE 9, 10 и 11. Когда функция запускается, IE сбрасывает положение прокрутки страницы до 0, самого верха, а затем анимирует до нужного раздела. Я ищу способ, чтобы поведение прокрутки соответствовало тому, что найдено в других браузерах, где оно прокручивается с текущей позиции. Вот мой соответствующий код:

Во-первых, я привязываю событие клика к своему элементу:

$("body").on("click", ".marker", function() {
    window.requestAnimationFrame(function() {
        theAutoScrollingFunctions.scrollToTarget("city", 5000);
    });
});

Затем моя функция прокрутки:

$("html,body").animate({ scrollTop: $(document).height()}, 500, function() {
      // Callback stuff
});

Прокрутка технически работает, но в IE страница сбрасывается вверх, а затем прокручивается. Я пробовал размещать значения return false; на протяжении всего процесса, но безуспешно.

Кто-нибудь еще видел эту проблему?


javascript jquery internet-explorer scrolltop
person Yuschick    schedule 27.07.2015    source источник
comment
Вы должны предоставить минималистичный образец для воспроизведения проблемы   -  person A. Wolff    schedule 27.07.2015

Ответы (2)


arrow_upward
0
arrow_downward

Я использую ту же функцию анимации при прокрутке разделов на сайтах, которые я создаю. При тестировании в IE 8+ работает отлично. Возможно, $(document).height() - это та часть, которая делает сброс вверху?

Вот как я люблю это делать:

<ul id="section-links">
  <li><a href="#section1">Scroll to section1</a><li>
  <li><a href="#section2">Scroll to section2</a><li>
</ul>
<section id="section1">
  <h1>This is the first section</h1>
</section>
<section id="section2">
  <h1>Another example section</h2>
</section>

<style>
  section{display:block;width:100%;min-height:300px;}
</style>

<script>
  jQuery(document).ready(function($){
    $('#section-links a').click(function(){
      var section = $(this).attr('href');
      $('html, body').animate({scrollTop:$(section).offset().top - 10}, 'slow');
    });
  });
</script>

Как вы можете видеть, мне нравится добавлять немного пространства над прокручиваемым разделом, чтобы заголовок и еще что-то не застревали в окне просмотра.

Я не видел ошибки, которую вы описываете, используя этот метод.

Удачи

person CreMedian    schedule 27.07.2015
comment
Я ценю предложение, однако это не прояснило проблему. Я пытаюсь отследить его и отследить, но пока безуспешно. - person Yuschick; 27.07.2015

arrow_upward
0
arrow_downward

Проблема, похоже, была связана с моим селектором jQuery.

$("html,body").animate....

Изменился на

$("html").animate....

Похоже, это решило проблему в IE9+ и сохранило стабильное поведение в других браузерах, которые я тестировал.

person Yuschick    schedule 27.07.2015