Question

当窗口大小低于767px时，我有一些jQuery代码将div移动到流程中的后续位置。一切正常。

我还有一些jQuery代码，在页面加载后滚动主导航到主要内容，如果设备是＆lt; 767px。

scrollTop功能正常。 detach() + insertAfter()功能正常。

但是 ......

在insertAfter()代码影响的单个页面上，scrollTop代码滚动到错误的区域。它似乎是在元素移动之前滚动到锚点的位置。

有什么想法吗？页面在http://northqueensviewhomes.com/community处于实时状态（请记住，您必须缩小浏览器窗口以查看这些行为，并且必须重新加载小窗口以查看滚动功能）。

这是两个函数及其调用...

function rearrangeHelpfulLinks() {
   var $theLinks = $('#quicklinks.rc.well');
   if (($theLinks).length) {
      if ($(window).width() <= 767) {
         $theLinks.detach().insertAfter('.core-copy');
      } else {
         $theLinks.detach().insertAfter('#main-nav');
      }
   }
}


function scrollOnSmallScreen() {
   if ($(window).width() <= 767) {
      $('html, body').animate({
         scrollTop: ($('#main').offset().top - 13)
      }, 3210, 'easeInOutExpo');
   }
}

并在窗口大小调整... {/ p>上调用insertAfter()例程

$(window).resize(function() {
   rearrangeHelpfulLinks();
});

...并且在页面加载时调用滚动函数（为了完整性，简单地......）

   scrollOnSmallScreen();

不确定是否需要进一步帮助我（再次！），但我希望滚动到正确的位置，这只是锚点#main。

所有帮助表示赞赏。

Answer 1

使用

致电scrollOnSmallScreen();

setTimeout(scrollOnSmallScreen,0);

在您的胎面和DOM更改线程运行后，它将运行自动滚动。

在detach（）insertAfter（）之后ScrollTop滚动到错误的位置

1 个答案: