jQuery:fadeOut,shuffle,fadeIn(停止在shuffle工作)
问题描述:
我有一个无序列表。当我点击一个按钮洗牌,我需要:jQuery:fadeOut,shuffle,fadeIn(停止在shuffle工作)
- 项目淡出
- 然后随机化
- 然后渐退在
我的剧本工作的各个独立的部分。动画淡化适用于自己的作品,洗牌作品。问题在于脚本中的洗牌时,它直接跳到洗牌,并停止所有淡入或淡出。
这里是我的脚本:
$('.vShuffle').click(function(){
$('.list li').fadeOut(1000).shuffle().fadeIn(1000);
});
我也试过这个,这将淡出,那么我想也打乱,因为它没有经过做任何事情:
$('.vShuffle').click(function(){
$('.list li').fadeOut(1000, function() {
$('.list li').shuffle();
$('.list li').fadeIn(1000);
});
});
的我使用的洗牌脚本是从这里,它工作正常,除了在我的链条:http://mktgdept.com/jquery-shuffle
(function(d){d.fn.shuffle=function(c){c=[];return this.each(function(){c.push(d(this).clone(true))}).each(function(a,b){d(b).replaceWith(c[a=Math.floor(Math.random()*c.length)]);c.splice(a,1)})};d.shuffle=function(a){return d(a).shuffle()}})(jQuery);
任何帮助将非常明显。
感谢
答
没有做一些实质性的调试我不知道到底发生了什么错,但我猜这个问题有事情做下列要求:
$('.list li').fadeOut(1000, function() {
$('.list li').shuffle();
$('.list li').fadeIn(1000);
});
你意识到fadeOut
内的代码回调(即shuffle()
和fadeIn()
函数调用)正在每个.list li
元素运行一次?换句话说,如果您有10个元素与.list li
选择器匹配,则实际上您将在所有.list li
元素中混洗和淡入10次。这是因为每个匹配.list li
元素都会调用.fadeOut
,因此它的回调将被调用。
相反,只需调用.fadeOut
含有ul
元素,然后在回拨电话.fadeIn
含有元素,以及:
$('.vShuffle').click(function(){
$('ul').fadeOut(1000, function() {
$('li').shuffle();
$('ul').fadeIn(1000);
});
});
这里有一个工作示例:http://jsfiddle.net/mdur4/
答
编辑:
事实上,你必须使用这样的:
$('#myUl').fadeOut(1000, function() {
$('#myUl li').shuffle();
$('#myUl').fadeIn(1000)
});
由于对所有锂项目调用淡出导致了李回调函数施氮量被称为。不完全知道那是什么效果。
这个伟大的工程。谢谢。只是一个额外的想法,我一直在尝试。就是让每个人都一个接一个地褪色,我意识到这仍然有和以前一样的问题,因为我淡出李而不是ul开始。我试过这个:'$(“li”)。(函数(i)){(this)。延迟(50 * I).fadeIn(1000); });'它自己的作品,但在整个脚本中再次没有运气。 – shovelshed 2012-01-29 14:47:02