android.nick android.nick - 5 months ago 9
Javascript Question

why doesn't this line of code work?

im trying to basically make it so the user can't click #shareheart twice in a row, making the animation screw up. Maybe you could say i'm trying to create an active state without adding and removing classes?

why doesn't this work? The first piece of code is what's not working, it's not following this if statement, did i do something wrong here?

if($('.share-text').not(':animated') && $('.share-text span').is(':visible')) {
// do something
}


Here's the full code:

$('#shareheart').click(function() {
if ($('.share-text:animated').length == 0 && $('.share-text span').is(':visible')) {
$('.share-text span').animate({'opacity': '0'}, 800, function() {
$("#share-what").fadeOut(400)
$('.share-text').stop(true, false).animate({'width': 'toggle','padding-left': 'toggle','padding-right': 'toggle'}, 800)
$('#short-url').css('background-image', "url('images/drink.png')");
})
} else {
$('.share-text').stop(false, true).animate({'width': 'toggle','padding-left': 'toggle','padding-right': 'toggle'}, 800, function() {
$('.share-text span').animate({'opacity': '1'}, 800)
});
}
});

Answer

Alternatively, you can combine your condition to a single selector:

if($(".share-text:not(:animated) span:visible").length)
{
}

The condition will return 0 (a false value) if it share-text is a animated, or if the span is invisible.