mirror of
https://github.com/niklasvh/html2canvas.git
synced 2023-08-10 21:13:10 +03:00
Fix IE misalignment of content after scroll
This commit is contained in:
parent
7ce46e95cd
commit
9bae5b610a
@ -95,14 +95,29 @@ function createWindowClone(ownerDocument, width, height, options) {
|
||||
documentClone.write("<!DOCTYPE html>");
|
||||
documentClone.close();
|
||||
|
||||
documentClone.replaceChild(documentClone.adoptNode(documentElement), documentClone.documentElement);
|
||||
documentClone.replaceChild(removeScriptNodes(documentClone.adoptNode(documentElement)), documentClone.documentElement);
|
||||
if (options.type === "view") {
|
||||
container.contentWindow.scrollTo(window.scrollX, window.scrollY);
|
||||
container.contentWindow.scrollTo(window.pageXOffset, window.pageYOffset);
|
||||
}
|
||||
resolve(container);
|
||||
});
|
||||
}
|
||||
|
||||
function removeScriptNodes(parent) {
|
||||
[].slice.call(parent.childNodes, 0).filter(isElementNode).forEach(function(node) {
|
||||
if (node.tagName === "SCRIPT") {
|
||||
parent.removeChild(node);
|
||||
} else {
|
||||
removeScriptNodes(node);
|
||||
}
|
||||
});
|
||||
return parent;
|
||||
}
|
||||
|
||||
function isElementNode(node) {
|
||||
return node.nodeType === Node.ELEMENT_NODE;
|
||||
}
|
||||
|
||||
function Font(family, size) {
|
||||
var container = document.createElement('div'),
|
||||
img = document.createElement('img'),
|
||||
@ -334,7 +349,7 @@ LinearGradientContainer.prototype.stepRegExp = /((?:rgb|rgba)\(\d{1,3},\s\d{1,3}
|
||||
|
||||
function log() {
|
||||
if (window.html2canvas.logging && window.console && window.console.log) {
|
||||
window.console.log.apply(window.console, [(Date.now() - window.html2canvas.start) + "ms", "html2canvas:"].concat([].slice.call(arguments, 0)));
|
||||
Function.prototype.bind.call(window.console.log, (window.console)).apply(window.console, [(Date.now() - window.html2canvas.start) + "ms", "html2canvas:"].concat([].slice.call(arguments, 0)));
|
||||
}
|
||||
}
|
||||
|
||||
@ -348,6 +363,8 @@ function NodeContainer(node, parent) {
|
||||
this.computedStyles = null;
|
||||
this.styles = {};
|
||||
this.backgroundImages = null;
|
||||
this.transformData = null;
|
||||
this.transformMatrix = null;
|
||||
}
|
||||
|
||||
NodeContainer.prototype.assignStack = function(stack) {
|
||||
@ -499,32 +516,44 @@ NodeContainer.prototype.parseTextShadows = function() {
|
||||
};
|
||||
|
||||
NodeContainer.prototype.parseTransform = function() {
|
||||
var transformRegExp = /(matrix)\((.+)\)/;
|
||||
var transform = this.prefixedCss("transform");
|
||||
var matrix = parseMatrix(transform.match(transformRegExp));
|
||||
var offset = this.parseBounds();
|
||||
if (matrix) {
|
||||
var origin = this.prefixedCss("transformOrigin").split(" ").map(removePx).map(asFloat);
|
||||
origin[0] += offset.left;
|
||||
origin[1] += offset.top;
|
||||
|
||||
return {
|
||||
origin: origin,
|
||||
matrix: matrix
|
||||
};
|
||||
if (!this.transformData) {
|
||||
if (this.hasTransform()) {
|
||||
var offset = this.parseBounds();
|
||||
var origin = this.prefixedCss("transformOrigin").split(" ").map(removePx).map(asFloat);
|
||||
origin[0] += offset.left;
|
||||
origin[1] += offset.top;
|
||||
this.transformData = {
|
||||
origin: origin,
|
||||
matrix: this.parseTransformMatrix()
|
||||
};
|
||||
} else {
|
||||
this.transformData = {
|
||||
origin: [0, 0],
|
||||
matrix: [1, 0, 0, 1, 0, 0]
|
||||
};
|
||||
}
|
||||
}
|
||||
return this.transformData;
|
||||
};
|
||||
|
||||
NodeContainer.prototype.parseTransformMatrix = function() {
|
||||
if (!this.transformMatrix) {
|
||||
var transform = this.prefixedCss("transform");
|
||||
var matrix = transform ? parseMatrix(transform.match(this.MATRIX_PROPERTY)) : null;
|
||||
this.transformMatrix = matrix ? matrix : [1, 0, 0, 1, 0, 0];
|
||||
}
|
||||
return this.transformMatrix;
|
||||
};
|
||||
|
||||
NodeContainer.prototype.parseBounds = function() {
|
||||
return this.bounds || (this.bounds = this.hasTransform() ? offsetBounds(this.node) : getBounds(this.node));
|
||||
};
|
||||
|
||||
|
||||
NodeContainer.prototype.hasTransform = function() {
|
||||
var transform = this.prefixedCss("transform");
|
||||
return (transform !== null && transform !== "none" && transform !== "matrix(1, 0, 0, 1, 0, 0)");
|
||||
return this.parseTransformMatrix().join(",") !== "1,0,0,1,0,0";
|
||||
};
|
||||
|
||||
NodeContainer.prototype.MATRIX_PROPERTY = /(matrix)\((.+)\)/;
|
||||
NodeContainer.prototype.TEXT_SHADOW_PROPERTY = /((rgba|rgb)\([^\)]+\)(\s-?\d+px){0,})/g;
|
||||
NodeContainer.prototype.TEXT_SHADOW_VALUES = /(-?\d+px)|(#.+)|(rgb\(.+\))|(rgba\(.+\))/g;
|
||||
|
||||
|
4
build/html2canvas.min.js
vendored
4
build/html2canvas.min.js
vendored
File diff suppressed because one or more lines are too long
@ -88,7 +88,7 @@ function createWindowClone(ownerDocument, width, height, options) {
|
||||
|
||||
documentClone.replaceChild(removeScriptNodes(documentClone.adoptNode(documentElement)), documentClone.documentElement);
|
||||
if (options.type === "view") {
|
||||
container.contentWindow.scrollTo(window.scrollX, window.scrollY);
|
||||
container.contentWindow.scrollTo(window.pageXOffset, window.pageYOffset);
|
||||
}
|
||||
resolve(container);
|
||||
});
|
||||
|
@ -8,6 +8,8 @@ function NodeContainer(node, parent) {
|
||||
this.computedStyles = null;
|
||||
this.styles = {};
|
||||
this.backgroundImages = null;
|
||||
this.transformData = null;
|
||||
this.transformMatrix = null;
|
||||
}
|
||||
|
||||
NodeContainer.prototype.assignStack = function(stack) {
|
||||
@ -159,32 +161,44 @@ NodeContainer.prototype.parseTextShadows = function() {
|
||||
};
|
||||
|
||||
NodeContainer.prototype.parseTransform = function() {
|
||||
var transformRegExp = /(matrix)\((.+)\)/;
|
||||
var transform = this.prefixedCss("transform");
|
||||
var matrix = parseMatrix(transform.match(transformRegExp));
|
||||
var offset = this.parseBounds();
|
||||
if (matrix) {
|
||||
var origin = this.prefixedCss("transformOrigin").split(" ").map(removePx).map(asFloat);
|
||||
origin[0] += offset.left;
|
||||
origin[1] += offset.top;
|
||||
|
||||
return {
|
||||
origin: origin,
|
||||
matrix: matrix
|
||||
};
|
||||
if (!this.transformData) {
|
||||
if (this.hasTransform()) {
|
||||
var offset = this.parseBounds();
|
||||
var origin = this.prefixedCss("transformOrigin").split(" ").map(removePx).map(asFloat);
|
||||
origin[0] += offset.left;
|
||||
origin[1] += offset.top;
|
||||
this.transformData = {
|
||||
origin: origin,
|
||||
matrix: this.parseTransformMatrix()
|
||||
};
|
||||
} else {
|
||||
this.transformData = {
|
||||
origin: [0, 0],
|
||||
matrix: [1, 0, 0, 1, 0, 0]
|
||||
};
|
||||
}
|
||||
}
|
||||
return this.transformData;
|
||||
};
|
||||
|
||||
NodeContainer.prototype.parseTransformMatrix = function() {
|
||||
if (!this.transformMatrix) {
|
||||
var transform = this.prefixedCss("transform");
|
||||
var matrix = transform ? parseMatrix(transform.match(this.MATRIX_PROPERTY)) : null;
|
||||
this.transformMatrix = matrix ? matrix : [1, 0, 0, 1, 0, 0];
|
||||
}
|
||||
return this.transformMatrix;
|
||||
};
|
||||
|
||||
NodeContainer.prototype.parseBounds = function() {
|
||||
return this.bounds || (this.bounds = this.hasTransform() ? offsetBounds(this.node) : getBounds(this.node));
|
||||
};
|
||||
|
||||
|
||||
NodeContainer.prototype.hasTransform = function() {
|
||||
var transform = this.prefixedCss("transform");
|
||||
return (transform !== null && transform !== "none" && transform !== "matrix(1, 0, 0, 1, 0, 0)");
|
||||
return this.parseTransformMatrix().join(",") !== "1,0,0,1,0,0";
|
||||
};
|
||||
|
||||
NodeContainer.prototype.MATRIX_PROPERTY = /(matrix)\((.+)\)/;
|
||||
NodeContainer.prototype.TEXT_SHADOW_PROPERTY = /((rgba|rgb)\([^\)]+\)(\s-?\d+px){0,})/g;
|
||||
NodeContainer.prototype.TEXT_SHADOW_VALUES = /(-?\d+px)|(#.+)|(rgb\(.+\))|(rgba\(.+\))/g;
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user