I'm having some trouble with the toggleClass
function. It doesn't seem to be working correctly for me. The image should toggle between displaying and hiding, but it only changes to hide, not back again.
You can view my example here, along with the following 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 suggestions on how to fix this issue?
Thank you in advance.