Herramientas para capturar y convertir la web
Comunidad en línea de GrabzIt

Problemas de Firefox con la posición

Tengo problemas para que la captura de pantalla funcione correctamente en Firefox en ciertas situaciones.

Firefox usa una propiedad CSS "insertada" que ningún otro navegador usa (https://developer.mozilla.org/en-US/docs/Web/CSS/inset). Se usa en lugar de izquierda / derecha / arriba / abajo. Al menos en mi versión de FF, incluso obliga a que se use reemplazando cualquier CSS izquierdo / derecho / ... GrabzIt no reconoce esta propiedad, por lo que la imagen no es correcta para los usuarios de Firefox.

¿Alguien más ha experimentado esto y tiene una solución?

Preguntado por Corey Alderin el miércoles, 18 septiembre, 2019 11: 00: 32 AM

¿Quizás poner el código CSS que es susceptible de cambiar en un archivo CSS externo y hacer referencia a él en su HTML de esa manera?

Respondido por GrabzIt Support el miércoles, 18 septiembre, 2019 11: 22: 48 AM

Eso no funcionaría en mi caso. Necesito tener el CSS en línea porque no siempre es lo mismo. Cambia dependiendo del usuario.

Respondido por Corey Alderin el miércoles, 18 septiembre, 2019 12: 11: 07 PM

En mi versión de Firefox probé con esto:

<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>

Los datos publicados fueron esto:

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

No se envió ningún recuadro.

Respondido por GrabzIt Support el miércoles, 18 septiembre, 2019 12: 24: 10 PM

He estado probando esto más y parece que esto está sucediendo cuando el usuario mueve un div. Mi aplicación permite que los elementos se muevan y eso es cuando Firefox está haciendo ese cambio. Probablemente pueda hacer algunos cambios en mi código para dar cuenta de esto.

Respondido por Corey Alderin el miércoles, 18 septiembre, 2019 05: 01: 42 PM