4 ms·
var removeGrayImage = function() { $("img").each(function(idx, el) { var canvas = $("<canvas/>")[0]; canvas.width = el.width; canvas.height = el.height;
by mark242 13y ago
var removeGrayImage = function() {
$("img").each(function(idx, el) {
var canvas = $("<canvas/>")[0];
canvas.width = el.width;
canvas.height = el.height;
canvas.getContext("2d").drawImage(el, 0, 0, el.width, el.height);
var pixel = canvas.getContext("2d").getImageData(1, 1, 1, 1);
var r = pixel.data[0];
var g = pixel.data[1];
var b = pixel.data[2];
if(r == 183 && g == 183 && b == 183) {
$(el).css({opacity: 0});
}
});
};
- lukegb 13y agoDamn, you went for the same solution as me. I didn't think anyone else would so obtuse as to use a canvas to access the raw image data. Here's my equivalent solution: var canvas = document.createElement('canvas'); canvas.height = 1; canvas.width = 1; var twodctx = canvas.getContext('2d'); var blockImg = null; var qs = document.querySelectorAll('img'); for (var i = 0; i < qs.length; i++) { var img = qs[i]; twodctx.drawImage(img, 0, 0, 1, 1); var imgd = twodctx.getImageData(0,0,1,1); if (imgd.data[0] == imgd.data[1] && imgd.data[0] == imgd.data[2] && imgd.data[3] == 255) { var badDiv = document.createElement('div'); badDiv.style.display = 'none'; document.body.appendChild(badDiv); badDiv.appendChild(img.parentNode.removeChild(img)); break; } }
- someone13 13y agoI took yours and lukegb's a bit further - thanks for the inspiration. Probably overkill, though :-P var removeImageByHash = function() { var bad = [525994816]; var canvas = document.createElement('canvas'); var ctx = canvas.getContext("2d"); var imgs = document.querySelectorAll('img'); for( var idx = 0; idx < imgs.length; idx++ ) { var el = imgs[idx]; canvas.width = el.width; canvas.height = el.height; ctx.drawImage(el, 0, 0, el.width, el.height); var hash = 0; for( var i = 0; i < el.width; i++ ) { for( var j = 0; j < el.height; j++ ) { var pixel = ctx.getImageData(1, 1, 1, 1); hash = ((hash << 5) - hash) + pixel.data[0]; hash |= 0; hash = ((hash << 5) - hash) + pixel.data[1]; hash |= 0; hash = ((hash << 5) - hash) + pixel.data[2]; hash |= 0; } } var found = false; for( var i = 0; i < bad.length; i++ ) { if( bad[i] === hash ) { found = true; break; } } if( found ) { var hidden = document.createElement('div'); hidden.style.display = 'none'; hidden.style.width = 0; hidden.style.height = 0; document.body.appendChild(hidden); hidden.appendChild(el.parentNode.removeChild(el)); } console.log(idx + ": " + hash); } };
- ryanskidmore 13y agoThis solution (and those listed in the comments) are all very interesting solutions, well done. They might not work with different colour images, but they are interesting nonetheless.