在两个jQuery动画中间执行代码？

我有以下代码切换一些全屏幕背景图像（fadeout，fadeIn）。在两个jQuery动画中间执行代码？

setInterval(function() { 
     var id = parseInt($('img.active').attr('id').substring(3,4)); 
     var id_next = id; 
     switch(id) { 
      case 0: 
       id_next = 1; 
       break; 
      case 1: 
       id_next = 2; 
       break; 
      case 2: 
       id_next = 0; 
       break; 
     } 
     $('img.active').fadeOut('slow', function() { 
      $('img#bg_' + id).removeClass('active'); 
      $('div.start-headline h1').html(hl[id]); 
      $('div.start-headline h2').html(sl[id]); 
     }); 
     $('img#bg_' + id_next).fadeIn('slow', function() { 
       $('img#bg_' + id_next).addClass('active'); 
       $('div.start-switches div').removeClass('active'); 
       $('div.start-switches div#' + id).addClass('active'); 
      }); 
    }, 6000);

我怎么能知道这个代码，它应该在这两个衰落的中间执行这两条线

$('div.start-headline h1').html(hl[id]); 
$('div.start-headline h2').html(sl[id]);

？现在它执行后的图像褪色...

在此先感谢！

来源

2012-06-15 Tronic

你想在淡出结束和淡入淡出即将开始之后进行干预吗？ –

当淡出完成并淡入开始的时候，是的！ – Tronic

我想你在找什么是要排队的，所以它运行淡出 - >新排队 - >淡入

$('img.active').fadeOut('slow', function() { 
    $('img#bg_' + id).removeClass('active'); 
}); 
$('img.active').queue(function() { 
    $('div.start-headline h1').html(hl[id]); 
    $('div.start-headline h2').html(sl[id]); 
    $(this).dequeue(); 
}); 
$('img#bg_' + id_next).fadeIn('slow', function() { 
    $('img#bg_' + id_next).addClass('active'); 
    $('div.start-switches div').removeClass('active'); 
    $('div.start-switches div#' + id).addClass('active'); 
});

来源

2012-06-15 14:10:40 hitmanDX

谢谢，它做得很好！ – Tronic

如果我理解了问题，我认为你需要把

$('img#bg_' + id_next).fadeIn('slow', function() { 
      $('img#bg_' + id_next).addClass('active'); 
      $('div.start-switches div').removeClass('active'); 
      $('div.start-switches div#' + id).addClass('active'); 
     });

步入回调只是afther的$('img#bg_' + id).removeClass('active');

如果我没有理解好这个问题，请您可以指定当代码执行时（如果淡入淡出或之后），所以也许我可以帮助你。

来源

2012-06-15 14:06:55

大致找出“慢”动画淡出和添加像100毫秒的时间，在延迟中使用该时间。将延迟码淡出之外出

$('div.start-headline h1').delay(fadeout_time+100).html(hl[id]);

我不知道如果延迟会影响动画或没有，但你可以测试一下，看看它是否工作。我想你也可以设置其他的时间间隔与关系到一个你已经有操纵HTML

来源

2012-06-15 14:09:47 Huangism

在两个jQuery动画中间执行代码？

回答

相关问题