Html2canvas: Opacité

Cela dépend de la manière dont vous utilisez l'opacité. Mettez un exemple en utilisant jsfiddle.

J'ai aussi essayé de faire fonctionner Opacity et cela ne semble pas le maintenir.

J'ai une image dans un div. Le div a un css en ligne opacity: 0.78; mais sur la capture d'écran, il est 100% opaque.

Navigateur @Dayjo ? OS? x86 ou x64? Mettez un exemple jsfiddle s'il vous plaît =)

OSX 10.11.4
Firefox 44.0.2
Chrome 49.0.2623.112

Edit: OK, donc je semble avoir résolu cela en ajoutant un peu de CSS supplémentaire à la balise img. J'ai défini explicitement;

display: block;
position: static;

Et maintenant, les images prennent en charge l'opacité, bien que je ne sache pas pourquoi elle doit être bloquée, et la position: relative semble l'empêcher de fonctionner. D'autres éléments qui ne sont pas position: relative (c'est-à-dire un div avec du texte) fonctionnaient bien.

Voici un jsFiddle illustrant le problème: http://jsfiddle.net/tqqaa16x/. J'ai du mal avec ça aussi.

L'opacité ne semble pas fonctionner avec les exemples les plus simples:
https://jsfiddle.net/JoolsCaesar/yLj4qwe2/3/
https://jsfiddle.net/JoolsCaesar/yLj4qwe2/5/
(Testé dans Chrome)

Corrigé dans https://github.com/niklasvh/html2canvas/tree/v1.0.0

@niklasvh J'ai toujours le même problème avec la version 1.0.0-alpha.12 J'ai un div avec des coins arrondis, l'arrière-plan du site Web est sombre mais sur l'image enregistrée, il a des coins blancs alors qu'ils devraient être transparents.

EXEMPLE:

Cela ne fonctionne pas non plus pour moi. L'opacité est perdue.

@Andy

@niklasvh J'ai toujours le même problème avec la version 1.0.0-alpha.12 J'ai un div avec des coins arrondis, l'arrière-plan du site Web est sombre mais sur l'image enregistrée, il a des coins blancs alors qu'ils devraient être transparents.

EXEMPLE:

Vous devez utiliser la couleur de fond: rgba (x, x, x, opacityValue) remplace pour l'opacité le style css devrait résoudre votre problème.

Corrigé dans https://github.com/niklasvh/html2canvas/tree/v1.0.0

ce lien ne fonctionne pas maintenant!

Je peux confirmer que l'opacité ne fonctionne toujours pas dans la dernière version: 1.0.0-rc.7. Peut-être pouvons-nous faire rouvrir ce billet?

Je peux confirmer que l'opacité ne fonctionne toujours pas dans la dernière version: 1.0.0-rc.7. Peut-être pouvons-nous faire rouvrir ce billet?

Utilisez cette version: https://github.com/niklasvh/html2canvas/suites/1187063696/artifacts/17429870 , l'opacité fonctionnera.

Je peux confirmer que l'opacité ne fonctionne toujours pas dans la dernière version: 1.0.0-rc.7. Peut-être pouvons-nous faire rouvrir ce billet?

Utilisez cette version: https://github.com/niklasvh/html2canvas/suites/1187063696/artifacts/17429870 , l'opacité fonctionnera.

A quoi tu m'as lié exactement? Je l'ai ouvert et il est dit que c'est v1.0.0-rc.7 ...

Je peux confirmer que l'opacité ne fonctionne toujours pas dans la dernière version: 1.0.0-rc.7. Peut-être pouvons-nous faire rouvrir ce billet?

Utilisez cette version: https://github.com/niklasvh/html2canvas/suites/1187063696/artifacts/17429870 , l'opacité fonctionnera.

A quoi tu m'as lié exactement? Je l'ai ouvert et il est dit que c'est v1.0.0-rc.7 ...

le nom de la version est le même mais dans ce fichier js, le bogue d'opacité est corrigé.

Je peux confirmer que l'opacité ne fonctionne toujours pas dans la dernière version: 1.0.0-rc.7. Peut-être pouvons-nous faire rouvrir ce billet?

Utilisez cette version: https://github.com/niklasvh/html2canvas/suites/1187063696/artifacts/17429870 , l'opacité fonctionnera.

A quoi tu m'as lié exactement? Je l'ai ouvert et il est dit que c'est v1.0.0-rc.7 ...

le nom de la version est le même mais dans ce fichier js, le bogue d'opacité est corrigé.

Peut-être pourriez-vous faire une pull request afin que toute la communauté puisse bénéficier de ce correctif et que nous puissions continuer à utiliser yarn (ou npm) pour la dépendance html2canvas?

@niklasvh Je viens de commencer à utiliser html2canvas dans mon projet et c'est génial! Mais je rencontre également ce bogue d'opacité - le bundle ci-dessus résout-il ce problème / y a-t-il une chance que vous puissiez le publier et mettre à jour le package npm publié?

@davidswinegar cela a fonctionné pour moi. Le dernier chiffre étant l'opacité

background-color: rgba(25, 163, 71, .5);