工作需求中要做一个将整个页面变成图片下载在本地的功能。使用了html2canvas第三方JS插件。在渲染的时候,因为原页面含有DIV和canvas连线,出来的图片,div正常,但是canvas连线相对DIV偏移向上了。一开始以为是h...

工作需求中要做一个将整个页面变成图片下载在本地的功能。
使用了html2canvas第三方JS插件。
在渲染的时候,因为原页面含有DIV和canvas连线,出来的图片,div正常,但是canvas连线相对DIV偏移向上了。
一开始以为是html2canvas在渲染原页面canvas的时候会出问题,找了很多文章看。
但是最终确定了,其实是因为原页面中的DIV 使用了position:absolute;top:200px。而canvas中使用了相对定位position:absolute;top:20%。
把top:20%改为top:230px之后,图片就正常了。
也就是说,使用html2canvas的时候,渲染的页面尽量不要使用相对定位,这样出来的图片容易变形。
本文标题为:html2canvas渲染时候,样式走样问题。(前端)


基础教程推荐
- 高德地图WEB版基础控件展示 原创 2022-11-16
- 《CSS3实战》笔记--渐变设计(三) 2022-11-16
- JS中some和every的区别和用法详解 2023-08-08
- Ajax返回值类型与用法实例分析 2023-02-22
- AJax与Jsonp跨域访问问题小结 2022-10-18
- 关于 ios:Sencha – 禁用 Sencha 事件 2022-09-15
- 原生ajax瀑布流demo分享(必看篇) 2023-02-01
- Ajax工作原理及优缺点实例解析 2023-02-23
- 用html自己开发自己的串口TCP通讯调试软件 2023-10-26
- 给Ajax返回的HTML标签动态添加样式的方法 2023-02-01