jQuery scrollTop - 移动结束时的动画扫描

我使用jQuery的scrollTop函数在不同的锚点之间切换时使我的滚动平滑。首先，这里是urljQuery scrollTop - 移动结束时的动画扫描

这是我的jQuery脚本

“ZIEL”仅仅是“目标”的德语单词，只是为了让你知道为什么这个变量称为“ZIEL “

$(document).ready(function() { 
    $('a[href*=#]').bind("click", function(event) { 
     event.preventDefault(); 
     var ziel = $(this).attr("href"); 

     $('#portraitcontent').animate({ 
      scrollTop: $(ziel).offset().top 
     }, 3000 , function(){location.hash = ziel;}); 
}); 
return false; 
});

那么我该如何在动画结束时没有那么难看的跳动？有什么想法？

我真的不知道该怎么做。花了几个小时与那个婊子！

感谢您的意见！

编辑

那么这个新代码：

$(document).ready(function() { 
    $('a[href*=#]').bind("click", function(event) { 
     event.preventDefault(); 
     var ziel = $(this).attr("href"); 
     $('#portrait-entry').animate({ 
      scrollTop: $(ziel).offset().top - 230 
     }, 1500 , function(){ 

      if(window.history.replaceState){ 
       window.history.replaceState(null, document.title, ziel); // <--here 
      } 
     }); 
}); 
return false; 
});

平滑滚动工作没有丑陋的跳跃但现在我anchorlinks不工作应该的样子。

请检查the problem - 当您点击“fortbildungen”，然后点击“mitgliedschaften”时，它不会滚动到锚点。我想我必须做重置或s.th.就像那样，因为我认为当你在#anchor页面上时，这些链接不应该如何工作。

我没有进入js/jquery。所以也许有人可以给我一个建议。我不知道如何谷歌这种问题。

感谢您的帮助和编辑的代码，这使我的滚动流畅。

来源

2012-12-05 mobsteady

在动画的回调函数，你告诉窗口通过设置'的location.hash = ziel'来执行跳跃。 – Ohgodwhy

最后我决定删除此scrollTop的代码，并与jQuery.localScroll切换到 jQuery.scrollTo插件的组合。

只是为了让你知道

来源

2012-12-05 23:56:04 mobsteady

仅仅因为您在动画回调中更改了网址导致了难看的跳跃。

支持html5的浏览器的解决方案是使用“window.history.replaceState”更改url，而不是直接更改url。

的代码将如下所示：

$(document).ready(function() { 
    $('a[href*=#]').bind("click", function(event) { 
     event.preventDefault(); 
     var ziel = $(this).attr("href"); 

     $('#portraitcontent').animate({ 
      scrollTop: $(ziel).offset().top 
     }, 2500 , function(){ 

      if(window.history.replaceState){ 
       window.history.replaceState(null, document.title, ziel); // <--here 
      } 
     }); 
}); 
return false; 
});

来源

2012-12-05 05:00:29

jQuery scrollTop - 移动结束时的动画扫描

回答

相关问题