title: How can I toggle between two functions in a .keypress();?
body: <p>Here is my site: <a href="http://mttdn.com/dev/" rel="nofollow">http://mttdn.com/dev/</a></p>
  
  <p>If you click the light switch button in the top right, you will see that a hidden div slides in from the right. Click the button again, and it slides back. I want to be able to make that same action take place when the 'P' key is pressed. I am able to setup the .keypress();, which you can see if you click 'P', however, as you will also see, using the same code I did for the .click();, the div slides in, then slides out right away. I am trying to figure out how to use .toggle(); in conjunction with .keypress(); so that this doesn't happen.</p>
  
  <p>Here is my code:</p>
  
  <pre><code>$(document).ready(function(){
      var previewopen = $(".codepreview");
  
      $(document).keypress(function(event){
          if (event.which == 112){
              previewopen.animate({left:"-=50%",},'normal');
              previewopen.animate({left:"+=50%",},'normal');
          }
      });
  });
  </code></pre>
  
  <p>I just want to be able to click 'P', have the div slide out and stop, then click 'P' again to have it slide back. What is the best way to accomplish this? Any help is greatly appreciated! Thanks!</p>