如何滚动到页面中间（50%）

Question

如果不使用流行的scrollTo插件，我如何滚动到页面/div的垂直中间（50％）？

Answer 1

这会将 div 的内部滚动滚动到其垂直中间

var myDiv = $("#yourdiv");
var scrollto = myDiv.offset().top + (myDiv.height() / 2);
myDiv.animate({ scrollTop:  scrollto});

Answer 2

JQuery - 跳转到滚动 div 垂直/水平中间的

垂直

$("#centralize-ver").click(function(){//centralize vertical
    var scrollableDivJ=$("#scroll-div");
    scrollableDivJ.scrollTop("1000000");//scroll to max
    var scrollHeight=scrollableDivJ.prop("scrollHeight");
    var diff=(scrollHeight-scrollableDivJ.scrollTop())/2;
    var middle=scrollHeight/2-diff;
    scrollableDivJ.scrollTop(middle);
});

/水平

$("#centralize-hor").click(function(){//centralize horizontal
    var scrollableDivJ=$("#scroll-div");
    scrollableDivJ.scrollLeft("1000000");//scroll to max
    var scrollWidth=scrollableDivJ.prop("scrollWidth");
    var diff=(scrollWidth-scrollableDivJ.scrollLeft())/2;
    var middle=scrollWidth/2-diff;
    scrollableDivJ.scrollLeft(middle);
});

将“#scroll-div”替换为您的 div。 “身体”对我不起作用。

jsfiddle

这是唯一适合我的解决方案。实际上，它是一个 2 小时尝试和错误的解决方案，可以很好地完成其工作。也许有人可以解释为什么scrollTop永远不会达到prop(“scrollheight”)的值并且diff和middle的书面计算是必要的。