위치 관련 Firefox 문제
웹 페이지 또는 HTML을 캡처하거나 변환하는 방법에 대한 질문 into 이미지, CSV, PDF 또는 DOCX 문서 및 비디오 변환 방법 into 애니메이션 GIF는 API를 사용합니다.
특정 상황에서 Firefox에서 스크린샷이 올바르게 작동하는 데 문제가 있습니다.
Firefox는 다른 브라우저에서 사용하지 않는 "inset" CSS 속성을 사용합니다(https://developer.mozilla.org/en-US/docs/Web/CSS/inset). 왼쪽/오른쪽/위/아래 대신 사용됩니다. 적어도 내 FF 버전에서는 왼쪽/오른쪽/... CSS를 대체하여 강제로 사용하도록 합니다. GrabzIt은 이 속성을 인식하지 못하므로 Firefox 사용자에게는 이미지가 올바르지 않습니다.
다른 사람이 이것을 경험하고 해결책을 가지고 있습니까?
내 경우에는 작동하지 않습니다. 항상 동일하지는 않기 때문에 CSS를 인라인으로 유지해야 합니다. 사용자에 따라 변경됩니다.
내 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>
삽입된 내용이 전송되지 않았습니다.