Question

Hi
In jQuery, we can use the code as below, to make the image darkly. In opposite, how can we bright up an image?

$(this).hover(function() {
    $(this).stop().animate({ opacity: 0.5 }, 500);
},
function() {
    $(this).stop().animate({ opacity: 1.0 }, 500);
});

Answer 1

I’d use Pixastic for this. It has jQuery bindings if you want to take that route.

You can lighten or darken an image like this:

var img = new Image();
img.onload = function() {
    Pixastic.process(img, "lighten", {amount:0.5});
}
document.body.appendChild(img);
img.src = "myimage.jpg";

---

You could fake this effect by changing the opacity of the image, making sure that the background behind the image is white.