Question

Take a look here to understand what I want to make:

http://jsbin.com/uvoruh

$(document).ready(function() {
    $("a.show_child").hover(
        function () {
            $(this).addClass("active");
            $(this).next().show();
        },
        function () {
            $(this).removeClass("active");
            $(this).next().hide();
        }
    );
    $("ul.child").hover(
        function () {
            $(this).prev().addClass("active");
            $(this).show();
        },
        function () {
            $(this).prev().removeClass("active");
            $(this).hide();
        }
    );      
});

Is a little exemple…with more css work perfect! but the problem is when I want to use slideUp() and slideDown() instead of show() and hide().

Answer 1

add stop

    $(document).ready(function () {
    $("a.show_child").hover(function () {
        $(this).addClass("active");
        $(this).stop(true).next().slideDown();
    }, function () {
        $(this).removeClass("active");
        $(this).stop(true).next().slideUp();
    });
    $("ul.child").hover(function () {
        $(this).prev().addClass("active");
        $(this).stop(true).slideDown();
    }, function () {
        $(this).prev().removeClass("active");
        $(this).stop(true).slideUp();
    });
});

http://jsfiddle.net/kAm2h/