I have the following code, it works fine on Firefox but the image is not being rendered on Chrome for some reason, any ideas?
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Test Html2Canvas</title>
<script type="text/javascript" src="jquery-1.6.3.js"></script>
<script type="text/javascript" src="html2canvas.js"></script>
<script type="text/javascript" src="jquery.plugin.html2canvas.js"></script>
</head>
<body>
testing
<img src="someImage.jpg"/>
<script type="text/javascript">
window.onload = function() {
html2canvas( [ document.body ], {
onrendered: function( canvas ) {
document.body.appendChild( canvas );
}
});
};
</script>
</body>
</html>
I have the following code, it works fine on Firefox but the image is not being rendered on Chrome for some reason, any ideas?
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Test Html2Canvas</title>
<script type="text/javascript" src="jquery-1.6.3.js"></script>
<script type="text/javascript" src="html2canvas.js"></script>
<script type="text/javascript" src="jquery.plugin.html2canvas.js"></script>
</head>
<body>
testing
<img src="someImage.jpg"/>
<script type="text/javascript">
window.onload = function() {
html2canvas( [ document.body ], {
onrendered: function( canvas ) {
document.body.appendChild( canvas );
}
});
};
</script>
</body>
</html>
2 Answers
Reset to default 3The image may not have loaded before the html2canvas attempts to draw it. Attempting to draw an image that hasn't loaded silently does nothing, so you get nothing.
Try wrapping your html2canvas call in a window.onload handler. NOT jQuery's ready because you NEED the code to run ONLY when all images etc. have fully loaded.
It will not work if you run this html file without any web server . If you are playing around on your PC then install XAMPP or any other web server (Easiest option http://www.apachefriends/en/xampp.html) and put the image ,JavaScript and HTML code in C:\xampp\htdocs (if C dirive is your installation drive) and run using the server. I have tested it in Chrome and its working.