Question

I’ve tried the following code to change some css properties (.overthumb) of a DIV (.thumbnail) when the mouse hovers over it. But, it doesn’t work!!! Any tips would be good on how to get it working. If possible, for the changes to animate as well.

$(document).ready(function(){
    $(".thumbnail").hover(
        function(){
            $(".overthumb").show();
        },
        function(){
            $(".overthumb").hide();
        }
    );
});

Answer 1

You could do all this with CSS.

http://jsfiddle.net/6wQp3/

---

Here’s an updated version. I forgot to set the div to position: relative;. Now the overlay should appear relative to the parent div.