html2canvas icon indicating copy to clipboard operation
html2canvas copied to clipboard

background-clip: text / box-shadow support

Open koreanman opened this issue 8 years ago • 9 comments

Good morning!

[html2canvas] is a Korean user who is using well. Now with this API, I've been very helpful with the work.

but, An error has been found in the processing of css3. I did not speak English well and I used Google Translator. Please understand that the grammar is not correct :)

Problems occur when applying various effects through css3

One. background-image: linear-gradient (115 deg, rgb (252, 0, 255), rgb (0, 219, 222)); color: transparent; -webkit-background-clip: text;

When using the image comes out in a completely different form. After the background processing, only the area of text should be designed, The entire area specified by background is captured.

  1. -webkit-box-shadow is not working.

I have written it in jsfiddle.

Please review it.

https://jsfiddle.net/koreanman/91vnqfar/40/

koreanman avatar Sep 04 '17 09:09 koreanman

Neither background-clip: text nor box-shadow are currently supported.

niklasvh avatar Sep 07 '17 15:09 niklasvh

Waiting for this fix since September. Background: clip is a very useful feature for many designers.

OlegShklyarov avatar Jan 03 '18 19:01 OlegShklyarov

i fixed this bug in my blog; https://jsfiddle.net/kaykie/2qnoxdoz/ you can use this code,remember if you want to use this you must set the fontsize with .1px ,like h1{font-size:30.1px}

kaykie avatar May 30 '18 08:05 kaykie

any upadte on that issue? this very important for my current project.

nurulalamador avatar Sep 23 '20 17:09 nurulalamador

Finaly after work of 6 days, i fixed the problem by writing custom code inside HTML2CANVAS.js. Here is demo: image

JSFiddle link - https://jsfiddle.net/9vhy58jp/

nurulalamador avatar Oct 02 '20 16:10 nurulalamador

https://jsfiddle.net/9vhy58jp/

url invalid

qzxuwenlong avatar Oct 17 '20 08:10 qzxuwenlong

你的html2canvas.js修改之后怎么发到远程让别人引用?

QFyfffS avatar Feb 15 '22 02:02 QFyfffS

最后,经过 6 天的工作,我通过在 HTML2CANVAS.js 中编写自定义代码解决了这个问题。这是演示: 图片

JSFiddle 链接 - https://jsfiddle.net/9vhy58jp/

你的html2canvas.js修改之后怎么发到远程让别人引用?

QFyfffS avatar Feb 15 '22 02:02 QFyfffS

box-shadow is already reported here: https://github.com/niklasvh/html2canvas/issues/246

Maki-Db avatar Sep 03 '24 12:09 Maki-Db