Question

http://jsfiddle.net/GNQyt/

Hover over green box, then move mouse to child list. Suddenly starts blinking like mad, anyway to prevent this but maintain the hover still over child?

*edited afterward

Answer 1

Here is your working code http://jsfiddle.net/GNQyt/18
I used the delay method. You have 1000ms once you leave the .icn to reach the ul. If you hit the ul in the desired time, the request for fading it out gets removed.

$('.icn').on({
    mouseenter: function() {

        clearTimeout($(this).data('timeoutId'));

        $(this).children('ul').show('fast');
    },
    mouseleave: function() {

        var self = this;

        var timeoutId = setTimeout(function() {
            $(self).children('ul').hide('fast');
        }, 1000);

        $(self).data('timeoutId', timeoutId); 
    }
});​