屏幕外的div不适用于html2canvas

时间:2015-07-30 17:27:05

标签: javascript jquery html5 canvas html2canvas

我使用html2canvas捕获一些div。如果div在捕获时在屏幕上,则一切正常。但是如果我碰巧向下滚动页面并且当时div不在屏幕上,那么它就不会捕获div。对于屏幕外捕获的div,画布输出通常是空白的。我怎样才能解决这个问题?即使div在屏幕上还是在屏幕外,我如何捕获div?

  var elem = document.getElementById('myElem');
     document.querySelector("button").addEventListener("click", function() {
        html2canvas(document.querySelector("#content"), {
           canvas: elem,
           width: 200,
           height: 250,
           useCORS: true
       }).then(function(canvas) {
           console.log('Drew on the existing canvas');
       });
   });

1 个答案:

答案 0 :(得分:1)

我也有捕获屏幕外元素的问题。事实证明,html和body元素已经溢出:它们上面隐藏着样式,导致捕获的屏幕外画布成为纯黑色图像。在捕获期间暂时重置html和body元素上的溢出样式解决了这个问题。在您的情况下,可能有其他具有溢出规则的元素以类似的方式干扰溢出是设置为隐藏还是滚动。