问题
Why is the following code not working? only the delayed fade out is working. Not the click event. If i comment the auto-fade out the click event is working. And how could i shorten the code?
Thanks for your help! :)
var wooMessage = $('.woocommerce-message');
var wooError = $('.woocommerce-error');
wooMessage.delay(9000).fadeOut(160);
wooError.delay(9000).fadeOut(160);
$('.woocommerce-message-close').click(function() {
wooMessage.fadeOut(160);
});
$('.woocommerce-error-close').click(function() {
wooError.fadeOut(160);
});
回答1:
ok got it after created my own jsfiddle for it - u "blocking" the woo-elements with the delay so there is already a animation going on u need to stop them first...then its working with the click
var wooMessage = $('.woocommerce-message');
var wooError = $('.woocommerce-error');
wooMessage.delay(9000).fadeOut(160);
wooError.delay(9000).fadeOut(160);
$('.woocommerce-message-close').click(function() {
wooMessage.stop().fadeOut(160);
});
$('.woocommerce-error-close').click(function() {
wooError.stop().fadeOut(160);
});
来源:https://stackoverflow.com/questions/27115613/jquery-on-click-fade-out-and-or-automatically-fade-out