Visible toggle problem?
$('.sub-menu').on('click', function(){
var menu = $(this).parents('.row').next()
$(menu).slideToggle();
var text = $(menu).is(':visible') ? 'open' : 'close';
$('.sub-menu-status').text(text);
});
For some reason, it only outputs close
, it never writes open
.
Checked code and trying this variant, getting the same result as above:
var text = $(menu).css('display') == 'none' ? 'open' : 'close';
Can anyone help me figure this out? Thank.
jsFiddle update: http://jsfiddle.net/#&togetherjs=LlkSSawSsb
+3
source to share
1 answer
From this question: I get what is(':visible')
will check when the transition starts slideToggle
. Therefore, it always returns true
.
try it
$('.sub-menu').on('click', function(){
var menu = $(this).parents('.row').next()
var text = $(menu).is(':visible') ? 'close' : 'open';
$(menu).slideToggle();
$('.sub-menu-status').text(text);
});
Or do it on callback slideToggle
$('.sub-menu').on('click', function(){
var menu = $(this).parents('.row').next()
$(menu).slideToggle(function() {
var text = $(menu).is(':visible') ? 'open' : 'close';
$('.sub-menu-status').text(text);
})
});
0
source to share