Question

I have a jquery ui accordion that was I was help to develop on here, the majority works fine but when you mouse in and out a few times it gets stuck, see screen shot below:

Menu error http://jsfiddle.net/AJBweb1986/mZnv8/4/

and here is the fiddle: fiddle

Answer 1

I hope it will work

See http://jsfiddle.net/ipsjolly/mjHSJ/ it works fine now without any stuck…

Replaced this

$(function() {
    $( "#accordion" ).accordion({
        event: 'click',
        collapsible: true,
        active: false,
        autoHeight: false,
        icons: {
            "header": "closedacc",
            "headerSelected": "openacc"
        }
    }).on('mouseleave', function() {
        $(this).accordion( "option", "active", false );
    }).children('li').on('mouseenter', function() {
        $(this).find('h3').trigger('click');
    });

});

​

With this

$(function() {
    $( "#accordion" ).accordion({
        event: 'click',
        collapsible: true,
        active: false,
        autoHeight: false,
        icons: {
            "header": "closedacc",
            "headerSelected": "openacc"
        }
    }).children('li').on('mouseenter', function() {
        $(this).find('h3').trigger('click');
    });

});
​

Actually I think mouseleave and mouseenter events were creating some kind of bottle neck situation so I removed one 😛