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 - 移動結束時的動畫掃描

回答

相關問題