html2Canvas截图包含滚动条解决思路

概况描述

在项目中使用html2Canvas进行截图时发现无法截取滚动条部分,前端是使用vue2的版本,网上找了很多方式都没效果,冷静思考后,给出解决办法。

解决思路

当我们截取的div容器的宽和高与内部的子容器div的宽和高不一样时,内部div就会出现滚动条,因为我们截取的div与内部div的宽和高不一致,所以截取时只能截取我们定位的div,无法截取到滚动条部分。

在截取时将定位的div宽和高改为和内部div容器的宽和高一致,截取时就能包含滚动条部分,截取结束后将定位的div的宽和高恢复原来的值,让界面正常

图片展示 

  • 原来包含滚动条的界面

  •  html2Canvas截取的图片(未添加处理办法时)

  • 使用上面处理思路后的截图

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/636954.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【公司UI自动化学习】

公司课程链接:https://l.jd.com/student/project/project.du?project_id697509403 公司的课程,是给一个学习方向。 一、 PC自动化 1)什么项目适合 2)PC自动化介入时间点 3)自动化率: 频繁改动的&…

一堆喷儿香喷儿香的工具网站-已经收藏-搜嗖工具箱!

文心一言 https://yiyan.baidu.com/ ​ ChatGpt横空出世的横空出世好像一把钥匙,开启了大模型时代,国内也有不错的产品,比如百度的文心一言,从3.5到4.0看得见的成长,现在的文心一言是我们工作中不可缺少的好帮手&am…

JavaEE 初阶篇-深入了解 File 文件操作(实现文件搜索、非空文件夹删除)

🔥博客主页: 【小扳_-CSDN博客】 ❤感谢大家点赞👍收藏⭐评论✍ 文章目录 1.0 File 文件概述 2.0 创建 File 类对象的方法 2.1 判断文件类型、获取文件信息的方法 2.2 创建文件、删除文件的方法 2.3 遍历文件夹的方法 3.0 文件搜索与删除 3.1…

HDMI to TYPE-C芯片|HDMI2.0转TYPE-C转接器方案|CS5802设计方案|ASL CS5802

CS5802输入端可以是1080P、4K30、4K60HZ这三种规格,输出的接口可以是TYPE-C信号接口,或者是TYPE-C信号接口,输入端HDMI由4路信号组成,支持1.62Gbps、2.7Gbps、5.4Gbps链路速率。内置可选SSC功能可降低EMI的干扰状况。 ASL CS5802芯片概述: 符合HDMI规范…

WordPress自动记录404死链方法+实用代码

WordPress自动记录404死链方法实用代码 WordPress自动将404死链记录到TXT文档中 在网站根目录新建文件: 404.txt,并设置权限为:755 将以下代码粘贴到你的 WordPress 主题中的 404.php $error_url https://.$_SERVER[HTTP_HOST].$_SERVER[…

【Spring Boot】掌握Spring Boot:深入解析配置文件的使用与管理

💓 博客主页:从零开始的-CodeNinja之路 ⏩ 收录文章:【Spring Boot】掌握Spring Boot:深入解析配置文件的使用与管理 🎉欢迎大家点赞👍评论📝收藏⭐文章 目录 Spring Boot 配置文件一. 配置文…

Java关键字和API

1 this和super关键字 1.this和super的意义 this:当前对象 在构造器和非静态代码块中,表示正在new的对象 在实例方法中,表示调用当前方法的对象 super:引用父类声明的成员 无论是this和super都是和对象有关的。 2.this和sup…

【微服务】spring读取配置文件多种方式深入详解

目录 一、前言 二、java配置文件介绍 2.1 java配置文件产生原因 2.2 项目使用配置文件好处 2.3 springboot项目配置文件的必要性 2.4 微服务架构下配置文件使用场景 三、java读取配置文件常用方法 3.1 使用Properties类读取配置文件 3.1.1 使用getResourceAsStream读取…

C++数组

概述: 所谓数组,就是一个集合,里面存放了相同类型的数据元素。 特点1:数组中的每个数据元素都是相同的类型 特点2:数组是由连续的内存位置组成的 一维数组 一维数组定义的三种方式: 1.数据类型 数组名[数…

前端开发与html学习笔记

一、前端开发概述 前端开发:也叫做web前端开发,它指的是基于web的互联网产品的页面(也可叫界面)开发及功能开发互联网产品:指网站为满足用户需求而创建的用于运营的功能及服务,百度搜索、淘宝、QQ、微博、网易邮箱等都是互联网产…

软件测试如何自我提升

当一个软件测试工程师刚刚进入行业一到三年的时间,他们通常需要掌握一些基本技能和知识,并且需要学习一些新的技术和工具,以便更好地完成自己的测试工作。以下是一些建议,帮助测试工程师在这个阶段提升自己的技能。 掌握基本的测…

边缘计算智能分析网关V4地面垃圾AI检测算法介绍及场景应用

在传统的卫生监管场景中,无法及时发现地面遗留的垃圾,通过人工巡逻的方式需要大量的人力、物力和时间,而且效率不高,并存在一定的滞后性,而采用地面垃圾AI检测算法则可以大大提高监管效率。 TSINGSEE青犀AI智能分析网…