该剧本来自David De Sandro http://close-pixelate.desandro.com/
这是我的HTML
<body>
<article>
<figure>
<img id="image" id="circles" class="portrait" src="img/original.jpg" alt="none" />
<figcaption>Caption Here</figcaption>
</figure>
</article>
这就是对IMG的关闭像素效应
<script>
var pixelations = {
'circles' : [
{ shape: 'diamond', resolution: 30, size: 31 },
{ shape: 'diamond', resolution: 30, offset: 15 },
{ resolution: 30, alpha: 0.5 }
],
var docReady = function() {
for ( var key in pixelations ) {
var img = document.getElementById( key ),
options = pixelations[key];
if ( img ) {
img.closePixelate( options )
}
}
};
window.addEventListener( 'DOMContentLoaded', docReady, false);
</script>
这给了我对图像的效果,但是我需要添加一个右键并保存JPG(应用了效果)?
--- ---编辑
如果我使用这个
var canvas = document.getElementById("circles");
if (canvas.getContext) {
var ctx = canvas.getContext("2d"); // Get the context for the canvas.
var myImage = canvas.toDataURL("image/png"); // Get the data as an image.
}
var image = document.getElementById("image"); // Get the image object.
image.src = myImage;
我有这个问题: 未捕获的TypeError:无法设置属性&#39; src&#39;为null