그냥 clearInterval() 함수를 만들 수 없습니다.

Question

clearInterval과 관련된 모든 게시물을 읽었지만 어떻게 든 작동하지 않게됩니다 ... 스크립트가 수행하는 작업은 ". xmas-title "이미지를 변경합니다. 그리고 마우스를 클릭하면 간격이 지워집니다.

var animation; 
$(".xmas-title").delay(4000).fadeIn(400, function(){ 
    bear_shake(true); 
}); 

$(".xmas-more").delay(4200).fadeIn(400, function(){ 
    $('.bg-xmas').css('cursor', 'pointer'); 
    $(".bg-xmas").click(function(){ 
     show_msg(); 
     bear_shake(false); 
    }); 
}); 

function bear_shake(bool){ 
    if(bool){ 
     animation = setInterval(function(){ 
      $(".xmas-bear").delay(200).fadeOut(0, function(){ 
       $(".xmas-bear").children("img").attr('src', 'images/xmas/xmas-bear_o1.png'); 
      }).fadeIn(0); 
      $(".xmas-bear").delay(200).fadeOut(0, function(){ 
       $(".xmas-bear").children("img").attr('src', 'images/xmas/xmas-bear_o2.png'); 
      }).fadeIn(0); 
     },0); 
     console.log('true'); 
    }else{ 
     clearInterval(animation); 
     console.log('false'); 
     $(".xmas-bear").children("img").attr('src', 'images/xmas/xmas-bear.png'); 
    } 
} 

Answer 1

여러분, 고맙습니다. 기본 사항을 놓친 것 같아요. 혼자 힘들게하려고했습니다. 저는 여러분 모두 의견을 모아 지금 작동하게되었습니다. 기능은 다음과 같이 재 작성 bear_shake :

function bear_shake(bool){ 
    if(bool){ 
     var i = 2; 
     animation = setInterval(function(){ 
      if(i % 2== 0){ 
       $(".xmas-bear").children("img").attr('src', 'images/xmas/xmas-bear_o1.png'); 
      }else{ 
       $(".xmas-bear").children("img").attr('src', 'images/xmas/xmas-bear_o2.png'); 
      } 
      i++; 
     },200); 
    }else{ 
     clearInterval(animation); 
     $(".xmas-bear").children("img").attr('src', 'images/xmas/xmas-bear.png'); 
    } 
} 

지금 명확하고 나를 위해 간단한 모양은, 여러분 모두 감사합니다. 그리고이 작업을 수행하는 다른 더 좋은 방법이나 더 똑똑한 방법이 있는지 궁금합니다.