Simplest way I can think of is overlaying a semitransparent div over the image.
A little example:
HTML
<div id="overlay" class="overlay"></div>
<img id="myimg" src="img.jpg" />
CSS
.overlay
{
display: block;
position: absolute;
background-color: rgba(200, 100, 100, 0.5);
top: 0px;
left: 0px;
width: 0px;
height: 0px;
}
JS (with JQuery)
overlay = $("#overlay");
img = $("#myimg");
overlay.width(img.css("width"));
overlay.height(img.css("height"));
overlay.css("top", img.offset().top + "px");
overlay.css("left", img.offset().left + "px");
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…