如果存在视口，为什么jQuery animate无法在移动设备上运行？

Question

因此，以下内容在我的桌面版网页上正常运行，但不会在移动版上引起任何滚动...

 $("HTML, BODY").animate({
        scrollTop: 500
    }, 1000);

这篇文章似乎暗示它与移动设备有关，不是在身体上滚动而是在视口上滚动。 而且，如果我从页面中删除此视口标签，则滚动确实起作用。

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

但是我看过存在视口标签但动画有效的页面，那能给什么呢？

Answer 1

就我而言，当窗口宽度小于930px时，我正在使用汉堡菜单。 在此限制之下，滚动被破坏了，因为我需要使站点内容滚动而不是正文：

var page = $('#myAnchor'); // target page
var speed = 750; // animation (ms)

if ($( window ).width() <= 930 ){
        $('.site-content').animate( { scrollTop: $(page).offset().top }, speed );
}
else {
        $('html, body').animate( { scrollTop: $(page).offset().top }, speed, function(){//calback} ); // Go 
    }

Answer 2

我遇到了与他描述的问题相同的问题。 我正在使用这个：

$(".buttonTop").click(function() {
  $('html, body').animate({
      scrollTop: $(".bestline").offset().top},
      1300);
});

正如他所描述的，删除<meta name="viewport" content="width=device-width, initial-scale=1.0">

事情开始起作用。 而且它与移动设备或浏览器无关，因为它也在Chrome控制台中发生。