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

回答

相关问题