我有一个div,#scrollable,带有滚动条,我想滚动到最后。 我可以通过将div的“scrollTop”属性设置为div的“scrollHeight”属性的值来实现:
var scrollable = d3.select("#scrollable");
scrollable.property("scrollTop", scrollable.property("scrollHeight"));
但我无法弄清楚,如果有的话,我可以补充它。
var scrollheight = scrollable.property("scrollHeight");
d3.select("#scrollable").transition().property("scrollTop", scrollheight);
不起作用。
感谢您的任何想法。 此致
答案 0 :(得分:8)
您可以使用自定义d3 tween转换scrollTop
等任意属性。
mbostock的Smooth Scrolling示例演示如何使用自定义补间来滚动整个文档。
以下是适合您的上下文的示例(也是bl.ocks.org上的viewable interactively):
var scrollable = d3.select("#scrollable");
d3.select("#down").on('click', function() {
var scrollheight = scrollable.property("scrollHeight");
d3.select("#scrollable").transition().duration(3000)
.tween("uniquetweenname", scrollTopTween(scrollheight));
});
function scrollTopTween(scrollTop) {
return function() {
var i = d3.interpolateNumber(this.scrollTop, scrollTop);
return function(t) { this.scrollTop = i(t); };
};
}