Question

I am trying to get a button to stop flashing after the fancybox has closed. I have tried every way I know and I am not sure why it is not unbinding. Here is the code:

    var clicked = true;
    var playbtn = $('.playbtn');

    function unpulse(){
       clicked = false;
       playbtn.unbind(pulse);
    }

    function pulse(){
       playbtn.delay(200).fadeOut('slow').delay(50).fadeIn('slow', pulse);
    }

    if (clicked) {
       pulse();
    }else if (!clicked) {
       alert('finally');
     };


     $('.playbtn a').fancybox({
        'type' : 'iframe',
        'transitionIn':'elastic',
        'transitionOut' :'elastic',
         'speedIn':600, 
         'speedOut':200, 
        'overlayShow':  false,
         'onClosed':unpulse
     });

Answer 1

You’re trying to remove an event, because that’s what .unbind does. (Also, your syntax for .unbind is not supported, but it’s not what you’re after anyway.) Instead, just check inside pulse whether or not to continue fading. This works because pulse is called recursively, so the check is done each time a fade iteration has stopped:

function pulse(){
  if(clicked) {
    playbtn.delay(200).fadeOut('slow').delay(50).fadeIn('slow', pulse);
  }
}