Firefox-problemen met positie
Stel vragen over het vastleggen of converteren van webpagina's of HTML into afbeeldingen, CSV-, PDF- of DOCX-documenten en over het converteren van video's into geanimeerde GIF's die onze API gebruiken.
Ik ondervind problemen bij het correct laten werken van de schermafbeelding in Firefox in bepaalde situaties.
Firefox gebruikt een ‘inset’ CSS-eigenschap die geen enkele andere browser gebruikt (https://developer.mozilla.org/en-US/docs/Web/CSS/inset). Het wordt gebruikt in plaats van links/rechts/boven/onder. In mijn versie van FF wordt het zelfs gedwongen om het te gebruiken door links/rechts/... CSS te vervangen. GrabzIt herkent deze eigenschap niet en daarom is de afbeelding niet correct voor Firefox-gebruikers.
Heeft iemand dit ook meegemaakt en een oplossing.
Misschien de CSS-code die vatbaar is voor verandering in een extern CSS-bestand plaatsen en er op die manier in uw HTML naar verwijzen?
Dat zou in mijn geval niet werken. Ik moet de CSS inline hebben omdat deze niet altijd hetzelfde is. Het verandert afhankelijk van de gebruiker.
In mijn versie van FireFox heb ik dit getest:
<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>
De geposte gegevens waren deze:
<style>
div{
top:1em;
left:1em;
position:absolute;
}
</style>
<div>Hello</div>
Er is geen inzet verzonden.
Ik heb dit meer getest en het lijkt erop dat dit gebeurt wanneer de gebruiker een div verplaatst. Met mijn app kunnen elementen worden verplaatst en dat is wanneer Firefox die wijziging doorvoert. Ik kan waarschijnlijk enkele wijzigingen in mijn code aanbrengen om hier rekening mee te houden.