jquery toggle() запускает нежелательную анимацию

У меня есть эта простая функция:

$('.tools-dropdown-launch').click(function(e) {
    e.preventDefault();
    $('.tools-dropdown-content').toggle(function () {
        fixPanelHeight();
    });
});

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

function fixPanelHeight() {
    var maxPanelHeight = 0;
    $(".inner-menu-panel-containter").children(".menu-panel").each(function(){
        var element = $(this);
        element.css("height", "auto");
        if (element.height() > maxPanelHeight) {
            maxPanelHeight = element.height();
        }
    })
    if (maxPanelHeight > 0) {
        $(".inner-menu-panel-containter").children(".menu-panel").height(maxPanelHeight);
    }
}

я попытался изменить первую функцию на

$('.tools-dropdown-launch').click(function(e) {
    e.preventDefault();
    $('.tools-dropdown-content').toggle();
});

и он работает как положено: у меня нет анимации, НО функция (конечно) не запускается.

почему это происходит?

Там нет высотных переходов в CSS и нет slideToggle() в любом месте файла JS.

это решается с

$('.tools-dropdown-content').slideToggle(0 , function () {
        fixPanelHeight();
    });

но я бы предпочел что-то лучшее, чем это быстрое исправление.

1 ответ

 $("#show_advance").click(function () {
            //  $(".ad_search").slideToggle("slow");
            if ($(".ad_search").is(':hidden')) {
                $('.advance_search').text('hide Advance Search');
                $(".ad_search").slideToggle("slow");
            }
            else {
                $('.advance_search').text('Show Advance Search');
                $(".ad_search").slideToggle("slow");
            }
        });

Используйте это может быть полезным для вас.

Другие вопросы по тегам