IOS Safari浏览器滚动到顶部打破jQuery的scrollTop的

Question

我点击时用了jQuery向下滚动到页面上的其他（动态加载）元素（在单击某个项目，在页面上的一些附加元素一些Ajax加载网页然后它会滚动到这些新添加的元素中的第一个项目）。

所有的工作都很好，除了在IOS Safari上，如果我使用点击状态栏滚动到页面顶部（正常的ios行为），然后点击我的任何链接，同时Ajax在新的元素，jQuery的scrolltop不再工作，我仍然坚持在页面的顶部（除非我然后手动滚动）。但是，如果我只滚动1px，然后点击任何链接，jQuery的scrolltop再次工作。就好像，无论何时使用IOS状态栏滚动到顶部功能，都会将其锁定在顶部，直到您手动滚动（即使只有1px），然后javascript滚动再次运行！

我测试过它在我的iPhone上的Chrome浏览器，它一切正常，它似乎是在Safari下。

这里曾经是我的一个链接被点击（并通过AJAX加载新的内容到页面），其滚动到新添加的元素的jQuery的例子：

$('ul.c1 a').click(function() { 
     $('html, body').delay(250).animate({ 
      scrollTop: $('.c2').offset().top 
     }, 200); 
    }); 

Answer 1

我解决此问题得到了通过调用window.scroll（0,1）在调用scrollTop上的jquery.animate之前'重置'滚动。它适用于我，因为我的导航由选择下拉菜单触发，并始终位于页面顶部。

$select.on('click', function(){ 
    window.scroll(0, 1); 
}); 

$select.on('change', function(){ 
    var $this = $(this), 
     idx  = $this.prop("selectedIndex") - 1, 
     dist = $timeline.find('.chapter').eq(idx).position().top; 

    $this.prop("selectedIndex", 0); 

    $('html, body').stop(true).animate({scrollTop: dist}, 250); 
});