jqueryでホバー上の複数のアニメーションのダブルループを停止します

Question

Ok ..私はいくつかの同様の質問がありますが、私はそれらを読んだが、私のコードはまだglitchyです。同じコンテナの中にイメージとテキストがあります。テキストがフェードアウトすると、画像がフェードインするはずです。 また、内部に画像とテキストを含む複数のコンテナがあります。

私は動作するコードを持っていますが、実際には見苦しく見えますが、うまく動作しないようです。これを改善する方法の提案？コード http://jsfiddle.net/pedromvpg/ekbf2/

：ここ

は実施例である

$(function() { 

    function image_pulse(element){ 
     element.animate({opacity:0.3}, 700, function(){ 
      element.animate({opacity:1}, 700, function(){ 
       element.animate({opacity:0.3}, 700, image_pulse(element));  
      }); 
     });    
    } 

    function text_pulse(element){ 
     element.animate({opacity:1}, 700, function(){ 
      element.animate({opacity:0}, 700, function(){ 
       element.animate({opacity:1}, 700, text_pulse(element));  
      }); 
     });    
    } 


    $('.pulser_new').each(function (i) { 
     text_pulse($(this).children('.fader_title')); 
     image_pulse($(this).children('.fader_image')); 
    }); 

    $('.pulser_new').hover(
     function() {     
      $(this).children('.fader_image').stop(); 
      $(this).children('.fader_image').animate({opacity:0.3},700); 
      $(this).children('.fader_title').stop(); 
      $(this).children('.fader_title').animate({opacity:1},700); 
      //alert("in"); 
     }, 
     function() { 
      image_pulse($(this).children('.fader_image')); 
      text_pulse($(this).children('.fader_title')); 
      //alert("out");  
     } 
    ); 

}）。

ありがとうございます！

Answer 1

私はコードを少しきれいにしてよりうまく動作させることができました。私の推測では、私は（ドキュメント）.ready ...

実施例でものを実行していなかったということです。http://jsfiddle.net/pedromvpg/XtZyr/

function image_pulse(element){ 
    var fadeDuration = 650; 
    element.css({ opacity: 0.33 }); 
    element.animate({ 
     opacity: 1 
    }, fadeDuration, function() { 
     element.animate({ 
      opacity: .33 
     }, fadeDuration, function() { 
       image_pulse(element); 
     }) 
    }); 
} 


function text_pulse(element){ 
    var fadeDuration = 650; 
    element.animate({ 
     opacity: 0 
    }, fadeDuration, function() { 
     element.animate({ 
      opacity: 1 
     }, fadeDuration, function() { 
       text_pulse(element); 
     }) 
    }); 
} 


jQuery(document).ready(function() { 

    $('.pulser_new').each(function (i) { 
     image_pulse($(this).children('.fader_image')); 
     text_pulse($(this).children('.fader_title')); 
     $(this).mouseover(function() { 
      $(this).children('.fader_image').stop().animate({opacity:0.3},700); 
      $(this).children('.fader_title').stop().animate({opacity:1},700); 
     }).mouseout(function() { 
      $(this).children('.fader_image').stop();   
      $(this).children('.fader_title').stop();   
      image_pulse($(this).children('.fader_image')); 
      text_pulse($(this).children('.fader_title')); 
     });   
    }); 

}); 



​