如何在jquery中的2个类之间切换？ [英] how to toggle in between 2 classes in jquery?

问题描述

我有一个问题， toggleClass 它似乎无法正常工作。图像应该在 show 和 hide 之间变化。它改变为隐藏，但没有回到

i have an issue doing toggleClass it doesn't seem to work properly. the image should change in between show and hide. It does change in to hide, but no back

这里是我的示例和一些代码：

here is my example and some code:

<div class="top_menu_hidden" style="display: none; ">testing</div>
<div class="show_menu"></div>

$('.show_menu').on('click', function(){
        $('.top_menu_hidden').stop().slideToggle('normal', function(){
            $(".show_menu").toggleClass("hide_menu show_menu");
        });
});​

.show_menu{
    background: url("http://placehold.it/150&text=show") no-repeat scroll 0 0 transparent;
    height: 150px;
    width: 150px;
}
.hide_menu{
    background: url("http://placehold.it/150&text=hide") no-repeat scroll 0 0 transparent;
    height: 150px;
    width: 150px;
}

任何想法？

any ideas?

感谢

推荐答案

$(".show_menu, .hide_menu").toggleClass("hide_menu show_menu");

DEMO

DEMO

完整代码

$('.show_menu').on('click', function() {
    $('.top_menu_hidden').stop().slideToggle('normal', function() {
        $(".show_menu, .hide_menu").toggleClass("hide_menu show_menu");
    });
});

这篇关于如何在jquery中的2个类之间切换？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！