Ferramentas para capturar e converter a Web
Comunidade Online de GrabzIt

Problemas do Firefox com a posição

Estou com um problema para conseguir que a captura de tela funcione corretamente no Firefox em determinadas situações.

O Firefox usa uma propriedade CSS "inserida" que nenhum outro navegador usa (https://developer.mozilla.org/en-US/docs/Web/CSS/inset). É usado em vez de esquerdo / direito / superior / inferior. Pelo menos na minha versão do FF, ele até o força a ser usado substituindo qualquer CSS esquerdo / direito / .... GrabzNão reconhece essa propriedade e, portanto, a imagem não está correta para os usuários do Firefox.

Alguém já experimentou isso e tem uma solução.

Perguntado por Corey Alderin na quarta-feira, 18 em setembro, 2019 11: 00: 32 AM

Talvez coloque o código CSS que é possível alterar em um arquivo CSS externo e faça referência a ele no seu HTML dessa maneira?

Respondida por GrabzIt Support na quarta-feira, 18 em setembro, 2019 11: 22: 48 AM

Isso não funcionaria no meu caso. Eu preciso ter o CSS embutido, porque nem sempre é o mesmo. Muda dependendo do usuário.

Respondida por Corey Alderin na quarta-feira, 18 em setembro, 2019 12: 11: 07 PM

Na minha versão do FireFox eu testei com isso:

<html>
<head>
<script src="grabzit.min.js"></script>
</head>
<body>
<div id="screenshot"><style>
div{
top:1em;
left:1em;
position:absolute;
}
</style>
<div>Hello</div></div>
<script>GrabzIt("APPLICATION KEY").ConvertHTML(document.getElementById('screenshot').innerHTML,{"target": "#captureThis",
"format": "png",
"transparent": 1,
"bwidth": 1200,
"bheight": 1000,
"hd": 1,
"width": 1200,
"height": 1000,
"hide": ".modal-backdrop",
"displayid": "finalImage"}).DataURI();
</script>
</body>
</html>

Os dados publicados foram os seguintes:

<style>
div{
top:1em;
left:1em;
position:absolute;
}
</style>
<div>Hello</div>

Não houve inserção enviada.

Respondida por GrabzIt Support na quarta-feira, 18 em setembro, 2019 12: 24: 10 PM

Eu tenho testado isso mais e parece que isso está acontecendo quando o usuário move uma div. Meu aplicativo permite que os elementos sejam movidos e é nesse momento que o Firefox está fazendo essa alteração. Provavelmente, posso fazer algumas alterações no meu código para explicar isso.

Respondida por Corey Alderin na quarta-feira, 18 em setembro, 2019 05: 01: 42 PM