title: jQuery audio fade out and pause, onclick fade in audio and resume
body: <p>What is the problem here? When I click the <code>#background_audio div</code>, the audio fades out then automatically fades in and continues playing without me pressing the button again. How do I fix it?</p>
  
  <p>I am trying to make it so that the audio fades out and pauses when #background_audio is clicked, and then when <code>#background_audio</code> is clicked again, the audio fades in and resumes.</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  $(document).ready(function(){
      $('#mute').click(function(){
          $('#background_audio').animate({volume: 0}, 1000);
          setTimeout(function(){('#background_audio').pause()},1000);
      });
      $('#mute').click(function(){
          $('#background_audio').animate({volume: 1}, 1000);
          setTimeout(function(){('#background_audio').pause()},1000);
      });
  });
  &lt;/script&gt;
  </code></pre>