動畫滾動到#hash頁面上隱藏的元素

我有一些問題。我有滾動到滾動aniamtion選定元素的JavaScript功能。這工作得很好，但問題是當我滑動/向下滑動（顯示隱藏）某些元素。動畫滾動到#hash頁面上隱藏的元素

如果點擊鏈接有類.show我表演關於部分。如果鏈接沒有這個類，我使用.slideUp函數來隱藏這個元素。這造成了錯誤，因爲現在襯裏並不精確（它錯誤地指向錯誤的地方）。它看起來像JavaScript考慮隱藏元素的高度，並計算所有錯誤。我不知道如何解決這個問題。感謝您的幫助。

var $root = $('html, body'); 
     $(document).on('click','.scroll-ani', function(event){ 
      if ($(this).hasClass('show')) { 
       if ($('#about').is(':hidden')) { 
       $('#about').slideDown(); 
       } 
      } else { 
       // if i replace slideUp with .hide() it will work well, but will not animate this slideUp effect. 
       $('#about').slideUp(); 
      } 
      var hash = this.hash; 
      if (hash && this.href.slice(0, -hash.length-1) == location.href.slice(0, -location.hash.length-1)) { 
       $root.animate({ 
        scrollTop: $(hash).offset().top 
       }, 'normal', function() { 
        location.hash = hash; 
       }); 
       return false; 
      } 
     });

來源

2016-10-28 user3573535

我會嘗試兩件事。而不是使用slideDown/Up，用css改變高度並給元素一個css轉換高度。也可以使用這個庫來動畫滾動：http://demos.flesler.com/jquery/scrollTo/。

也許問題是，當你使用$ root.animate（...）滾動到元素時，slideDown動畫沒有完成，因此offset（）。top沒有得到最終的正確值。手動設置CSS高度，並結合過渡應該解決問題（我gessing jquery使用傳統的js動畫，而不是css過渡）

來源

2016-10-28 09:30:08 mikepa88

動畫滾動到#hash頁面上隱藏的元素

回答

相關問題