我有一个简短的函数,可以在网站上显示消息。
function showHint() {
$('#notify').html('message text').show('slide', {direction: 'right'}, 500);
}
还有一个隐藏消息的函数。
function hideHint() {
$('#notify').hide('slide', {direction: 'right'}, 500);
}
问题是,如果我多次调用此函数,它会尝试同时显示所有消息,但一切都会中断。我想调用该函数两次,然后它应该对动画进行排队并一条接一条地显示消息。该函数应同时调用多次,但一个接一个显示。当第一条消息隐藏时,应该显示下一条消息。
我该如何解决问题?会很好!
最佳答案
这是我过去使用过的一个迷你自定义插件,它可以一个接一个地链接一堆动画。
// Good for serializing animations
$.fn.chain = function(fn) {
var elements = this;
var i = 0;
function nextAction() {
if (elements.eq(i)) fn.apply(elements.eq(i), [nextAction]);
i++;
}
nextAction();
};
您可以这样调用它 ( Here's an example of it in use ):
$(document).ready(function() {
$('li').chain(function(nextChain) { this.slideToggle("fast", nextChain); });
});
您传递给 chain
的函数传递了另一个函数,您必须在一个循环停止时调用该函数。在上面的示例中,我们只是将 nextChain
函数作为回调传递给 slideToggle
。
关于javascript - jQuery 队列消息,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1810943/