Инструменты для захвата и конвертирования Интернета
Интернет-сообщество GrabzIt

Проблемы Firefox с позицией

Задайте вопросы о том, как захватывать или конвертировать веб-страницы или HTML into изображения, CSV, PDF или DOCX документы, а также о том, как конвертировать видео into анимированные GIF с использованием нашего API.

У меня возникла проблема с корректной работой снимка экрана в Firefox в определенных ситуациях. 

Firefox использует свойство CSS «вставка», которое не использует ни один другой браузер (https://developer.mozilla.org/en-US/docs/Web/CSS/inset). Он используется вместо левого/правого/верхнего/нижнего. По крайней мере, в моей версии FF он даже заставляет его использовать, заменяя любой левый/правый/... CSS. GrabzIt не распознает это свойство, поэтому изображение не подходит для пользователей Firefox. 

Кто-нибудь еще сталкивался с этим и имеет решение.

Вопрос от Кори Алдерина, 18 сентября 2019 г.

Возможно, поместите код CSS, который может быть изменен, во внешний файл CSS и таким образом ссылайтесь на него в своем HTML?

Ответ от службы поддержки GrabzIt от 18 сентября 2019 г.

В моем случае это не сработает. Мне нужно, чтобы CSS был встроенным, потому что он не всегда один и тот же. Оно меняется в зависимости от пользователя. 

Ответ Кори Олдерина 18 сентября 2019 г.

В моей версии 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 г.

Я тестировал это больше, и оказалось, что это происходит, когда пользователь перемещает элемент div. Мое приложение позволяет перемещать элементы, и именно тогда Firefox вносит это изменение. Вероятно, я смогу внести некоторые изменения в свой код, чтобы учесть это. 

Ответ Кори Олдерина 18 сентября 2019 г.