Question

I am using the following code to animate a slideDown/slideUp effect when I hover over an element. The slideDown appears to be working fine, but when the mouse is no longer hovering over the element, the slideUp doesn’t kick in.

$('div.guest-tile-holder').hover(function() {
    $(this).find('div.options-bar').slideDown('slow');
}), function() {
    $(this).find('div-options-bar').slideUp('slow');
};

What am I missing to get the slideUp to work?

Answer 1

There was a syntax error (close bracket on line 3 should be on line 5) and typo in the 2nd hover function. You were doing a find for 'div-options-bar', not 'div.options-bar'

$('div.guest-tile-holder').hover(function() {
    $(this).find('div.options-bar').slideDown('slow');
}, function() {
    $(this).find('div.options-bar').slideUp('slow');
});