una prova al volo, se non passi per un webserver comunque non funzionera'
con safari non funziona (almeno, sono su windows), ma fa quello che deve con firefox/chrome
codice:
	function grayscale(el){		
		var imgObj = new Image();
		imgObj.onload=function(){
			var canvas = document.createElement('canvas');
			var ctx = canvas.getContext('2d');
			canvas.width = this.width;
			canvas.height = this.height; 
			ctx.drawImage(this, 0, 0); 
			var imgPixels = ctx.getImageData(0, 0, canvas.width, canvas.height);
			for(var y = 0; y < imgPixels.height; y++){
				for(var x = 0; x < imgPixels.width; x++){
					var i = (y * 4) * imgPixels.width + x * 4;
					var avg = (imgPixels.data[i] + imgPixels.data[i + 1] + imgPixels.data[i + 2]) / 3;
					imgPixels.data[i] = avg; 
					imgPixels.data[i + 1] = avg; 
					imgPixels.data[i + 2] = avg;
				}
			}
			ctx.putImageData(imgPixels, 0, 0, 0, 0, imgPixels.width, imgPixels.height);
			el.src=canvas.toDataURL();
		}
		imgObj.src = el.src;
	}
	$(function(){
		$('.myImgs').each(function(){
			grayscale(this);
		})
	})
[img]blablabla.gif[/img]
[img]blablabla.jpg[/img]

ciao