fix: element cropping & scrolling (#2625)

This commit is contained in:
Niklas von Hertzen
2021-08-04 20:58:17 +08:00
committed by GitHub
parent 1338c7b203
commit 878e37a242
90 changed files with 750 additions and 552 deletions

View File

@@ -0,0 +1,44 @@
<!DOCTYPE html>
<html>
<head>
<title>crop test</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script>
h2cOptions = {
x: 30,
y: 50,
width: 100,
height: 100
};
</script>
<script type="text/javascript" src="../../test.js"></script>
<style>
#div1 {
position: absolute;
left: 250px;
top: 250px;
width: 100px;
height: 100px;
background: green;
border-width: 50px 20px 100px 30px;
border-color: red;
border-style: solid;
}
body, html {
background: red;
}
</style>
</head>
<body>
<div id="div1">
great success
</div>
<script>
var forceElement = document.querySelector('#div1');
h2cSelector = forceElement;
</script>
</body>
</html>

View File

@@ -0,0 +1,48 @@
<!DOCTYPE html>
<html>
<head>
<title>element render test</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script>
h2cOptions = {ignoreElements: function(element) {
return element.className === 'ignored';
}};
</script>
<script type="text/javascript" src="../../test.js"></script>
<style>
#div1 {
width: 100px;
height: 100px;
background: green;
}
#ignored, .ignored {
background: red;
width: 100px;
height: 100px;
}
body, html {
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<div id="ignored" data-html2canvas-ignore>
great failure
</div>
<div class="ignored">
ignore predicate
</div>
<div id="div1">
great success
</div>
<script>
var forceElement = document.querySelector('#div1');
h2cSelector = forceElement;
</script>
</body>
</html>