Narzędzia do przechwytywania i konwertowania Internetu
Społeczność online GrabzIt

Firefox ma problemy z pozycją

Zadaj pytania, jak przechwytywać lub konwertować strony internetowe lub HTML into obrazy, dokumenty CSV, PDF lub DOCX, a także informacje na temat konwertowania filmów into animowane pliki GIF za pomocą naszego interfejsu API.

Mam problem z poprawnym działaniem zrzutu ekranu w przeglądarce Firefox w niektórych sytuacjach. 

Firefox używa „wstawki” właściwości CSS, której nie używa żadna inna przeglądarka (https://developer.mozilla.org/en-US/docs/Web/CSS/inset). Jest używany zamiast lewo/prawo/góra/dół. Przynajmniej w mojej wersji FF wymusza to nawet użycie go poprzez zastąpienie dowolnego lewego/prawego/... CSS. GrabzIt nie rozpoznaje tej właściwości, dlatego obraz nie jest prawidłowy dla użytkowników przeglądarki Firefox. 

Czy ktoś jeszcze się z tym spotkał i ma rozwiązanie.

Pytanie zadane przez Coreya Alderina 18 września 2019 r

Być może umieść kod CSS, który można zmienić, w zewnętrznym pliku CSS i odwołuj się do niego w ten sposób w swoim kodzie HTML?

Odpowiedź udzielona przez wsparcie GrabzIt w dniu 18 września 2019 r

W moim przypadku to by nie zadziałało. Muszę mieć wbudowany CSS, ponieważ nie zawsze jest taki sam. Zmienia się w zależności od użytkownika. 

Odpowiedź udzielona przez Coreya Alderina z 18 września 2019 r

W mojej wersji FireFox testowałem z tym:

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

Opublikowane dane były takie:

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

Nie wysłano żadnej wstawki.

 

Odpowiedź udzielona przez wsparcie GrabzIt w dniu 18 września 2019 r

Testowałem to więcej i wygląda na to, że dzieje się tak, gdy użytkownik przesuwa element div. Moja aplikacja umożliwia przesuwanie elementów i właśnie wtedy Firefox wprowadza tę zmianę. Prawdopodobnie będę mógł wprowadzić pewne zmiany w moim kodzie, aby to uwzględnić. 

Odpowiedź udzielona przez Coreya Alderina z 18 września 2019 r