jQuery .hover вызывает проблемы, если пользователь наводит курсор до того, как документ готов

Приведенный ниже код отлично работает, за исключением одного условия. Если пользователь наводит курсор на элемент до того, как документ будет готов, slideToggle выходит из синхронизации (или реверсируется).

Таким образом, в результате #logged_in_nav отображается при наведении мыши, а при наведении курсор исчезает. Каков простой способ исправить это?

   $("#logged_in_box").hover(function(){
            $("#logged_in_nav").stop(true, true).slideToggle("fast");
            $(this).addClass("logged_in_box_hover");
        }, // hover over
        function() {
            $("#logged_in_nav").stop(true, true).slideToggle("fast");
            $(this).removeClass("logged_in_box_hover");
        } // hover out
    ); // hover

jquery hover jquery-hover jquery-effects
person jhanifen    schedule 09.02.2011    source источник

Ответы (1)


arrow_upward
3
arrow_downward

Не используйте slideToggle. Используйте slideDown()(документы) и slideUp()(docs), поэтому направление явно привязаны к типу события.

$("#logged_in_box").hover(function(){
        $("#logged_in_nav").stop(true, true).slideDown("fast");
        $(this).addClass("logged_in_box_hover");
    }, // hover over
    function() {
        $("#logged_in_nav").stop(true, true).slideUp("fast");
        $(this).removeClass("logged_in_box_hover");
    } // hover out
); // hover
person user113716    schedule 09.02.2011