Is it possible to place an "overlay" div on top of a picture with color and as a result, gray out the part of the picture that the overlay is covering?
I know there is the -webkit-filter property, but that seems to only gray out the entire image the property applies to.
Putting a gray div on top of the picture does not seem to work either because some of the color from the image still seems to show through!
Right now the only solution I can think of is to overlay the exact same image on top of the original image with a -webkit-filter property on it.
Thanks in advanced.
Edit:
Sorry this probably isn't very good, but hopefully should illustrate what I want:
This is the original image. Notice the color:
After having an overlay on top of the original image, the pattern still shows, but now that section is completely devoid of all the red: