Smooth scroll to data-href

我知道堆棧中有很多平滑的滾動腳本，過去我已經採用了很多。由於我不想使用<a href="#">鏈接，因此我使用<buttons data-href="">。這是我當前的代碼：Smooth scroll to data-href

var $root = $('html, body'); 
$('.smooth').click(function() { 
     var href = $.attr(this, 'data-href'); 
     $root.animate({ 
       scrollTop: $(href).offset().top 
     }, 500, function() { 
       window.location.hash = href; 
     }); 
     return false; 
    alert('smoothness'); 
});

和必要的HTML部分：

<button id="downarrow" data-href="#features" class="smooth"> 
    <span>scroll down</span> 
</button>

這個偉大的工程，因爲看到這裏：DEMO

我不知道爲什麼，但它在我的現場使用相同的代碼不起作用。你可以在這裏查看它的構建：

來源

2016-03-08 Marian Rick

可能重複： http://stackoverflow.com/questions/3870057/how-can-i-update-window-location-hash-without-jumping-the-document。檢查是否有幫助。 – krato

這是一個CSS問題這一行：

我刪除的這種「溢出」屬性：

article#wrapper{height:100%;width:100%;}

You can see it in your fiddle right here

來源

2016-03-08 11:55:21

感謝您指點我正確的方向。由於'header {position：fixed}'不是一個bug，我建議你從你的答案中刪除它。從我的'＃wrapper'中刪除'overflow：auto'是唯一必須做的事情！：）謝謝你的幫助！ –

你對「header {position：fixed}」行是對的。很高興爲您服務！ :) –

Smooth scroll to data-href

回答

相關問題