css or jquery - hover over one div, another div fades or no display

Question

See http://jasondaydesign.com/masonry_demo/

I have title divs that overlay the underlying box div.

What I am trying to accomplish is when the mouse hovers over the .box div, the div holding the title will either fade out with jquery or just display:none through css.

Answer 1

You need to call .hover(), like this: (tested)

$('.box:has(div)').hover(
    function() { $(this).find('div').fadeOut(); },
    function() { $(this).find('div').fadeIn(); }
);