捕獲和轉換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 日回答