javascript - 屏幕外 div 不适用于 html2canvas

标签 javascript jquery html canvas html2canvas

我正在使用 html2canvas 来捕捉一些 div。如果捕获时 div 在屏幕上,则一切正常。但是,如果我碰巧向下滚动页面并且 div 当时不在屏幕上,那么它就不会捕获 div。对于屏幕外捕获的 div, Canvas 输出通常为空白。我怎样才能解决这个问题?如何捕获 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');
       });
   });

最佳答案

我在捕捉屏幕外元素时也遇到了问题。结果是 html 和 body 元素溢出:它们上面隐藏了样式,导致捕获的屏幕外 Canvas 是纯黑色图像。在捕获期间临时重置 html 和 body 元素的溢出样式解决了这个问题。在您的情况下,可能有其他具有溢出规则的元素以类似的方式干扰溢出是设置为隐藏还是滚动。

关于javascript - 屏幕外 div 不适用于 html2canvas,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31730344/

相关文章:

JavaScript 变量定义 : Commas vs. 分号

javascript - JSON 对象通过 jQuery 发布到 php

javascript - css transitions - 动画响应重新定位

jquery - 防止视差向后退

html - 我如何使用 css 和 Bootstrap 自定义我的复选框?

javascript - 使用 .find 搜索标签内的内容进行 jQuery 搜索

javascript - HTTP解析器: scraping single page application: many GETs,如何找出页面何时结束

javascript - 哪个 jQuery 代码更高效?

javascript - 每行仅突出显示一个单元格

javascript - 用 JavaScript 隐藏一个 html div