捕获和转换Web的工具
GrabzIt的在线社区

Firefox 的位置问题

询问有关如何捕获或转换网页或HTML的问题 into图像,CSV,PDF或DOCX文档以及如何转换视频 into使用我们的API的GIF动画。

在某些情况下,我无法在 Firefox 上正常使用屏幕截图。 

Firefox 使用其他浏览器不使用的“inset”CSS 属性 (https://developer.mozilla.org/en-US/docs/Web/CSS/inset)。 它用来代替左/右/上/下。 至少在我的 FF 版本中,它甚至强制通过替换任何左/右/... CSS 来使用它。 GrabzIt 无法识别此属性,因此该图像对于 Firefox 用户来说不正确。 

有没有其他人经历过这个并有解决方案。

科里·奥尔德林 (Corey Alderin) 于 18 年 2019 月 XNUMX 日提问

也许将易于更改的 CSS 代码放入外部 CSS 文件中并以这种方式在 HTML 中引用它?

GrabzIt 支持于 18 年 2019 月 XNUMX 日回复

这对我来说行不通。 我需要内联 css,因为它并不总是相同的。 它根据用户而变化。 

Corey Alderin 于 18 年 2019 月 XNUMX 日回答

在我的 FireFox 版本中,我对此进行了测试:

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

发布的数据是这样的:

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

没有发送任何插图。

 

GrabzIt 支持于 18 年 2019 月 XNUMX 日回复

我对此进行了更多测试,似乎当用户移动 div 时就会发生这种情况。 我的应用程序允许元素移动,这就是 Firefox 进行更改的时候。 我可能可以对我的代码进行一些更改来解决这个问题。 

Corey Alderin 于 18 年 2019 月 XNUMX 日回答