html2canvas 截取滚动条隐藏部分的内容

今天查了一下没有比较好的解决方案，于是自己写一篇。其实也很简单，首先就是用 Element.scrollHeight 获取要截图元素的高度，然后用总的高度减去可见的高度（用 jquery 的 height 方法获取），然后在 html2canvas 初始化的时候配置 Y 轴的偏移量为负的滚动条隐藏部分的高度。

不说了，直接上代码吧。

var scrollHeight = $('#theme1').prop("scrollHeight");
$('#theme1').scrollTop(scrollHeight);
var height = $('#theme1').height();

html2canvas(querySelector, {
                    scale: 3,
                    height: scrollHeight,  //画布高度（包含未显示的滚动部分）
                    y: (height + qRCodeHeight) - (scrollHeight + 20)  //Y 轴偏移量正好是负的未显示部分的高度
                }).then(function (canvas) {
                    canvas.toBlob(function (blob) {
                        saveAs(blob, pageID + type + ".jpg");
                    });
                });

这样就实现了，html2canvas 截取滚动条隐藏部分内容的功能了，你学会了吗？