Как остановить мигающий div?

Question

Я использую ниже JQuery образом моргать мой DIV:

JSFIDDLE

<div class="blink">blinking text</div>non-blinking 
<div class="blink">more blinking text</div> 

function blink(selector){ 
    $(selector).fadeOut('slow', function(){ 
     $(this).fadeIn('slow', function(){ 
      blink(this); 
     }); 
    }); 
} 

blink('.blink'); 

Но как остановить его мигать? Я просто хочу, чтобы он мигал только 5 раз.

Answer 1

Вы можете добиться этого с помощью CSS в одиночку, нет необходимости в Javascript:

@-webkit-keyframes blinker { 
    0% { opacity: 1.0; } 
    50% { opacity: 0.0; } 
    100% { opacity: 1.0; } 
} 
.blink { 
    -webkit-animation: blinker 1s 5; 
    -moz-animation: blinker 1s 5; 
    animation: blinker 1s 5; 
} 

Updated fiddle

Примечание значение 5 в конце заявления является animation-iteration-count. Вы можете внести поправку в этом случае.

Answer 2

вот решение,

Try This

var i = 0; 

function blink(selector) { 
    $(selector).fadeOut('slow', function() { 
     $(this).fadeIn('slow', function() { 
      i++ < 8 && blink(this); 
     }); 

    }); 
} 

blink('.blink'); 

здесь демо: Fiddle