title: PrettyPhoto - how to track when user closes the modal box
body: <p>I am using pretty photo to display videos - It pretty much works as the demo on the prettyphoto website </p>
  
  <p><a href="http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/#prettyPhoto" rel="nofollow">http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/#prettyPhoto</a></p>
  
  <p>If you look at the first demo - on my website - a similar window opens up but instead of an image a video is played.</p>
  
  <p>Now on this window, there is this small "x" on the bottom right corner. So when a user clicks on close - I want to track it. Basically when a user clicks on close - a jquery function should be triggered using which I can call a server side script.</p>
  
  <p>This is my current setup</p>
  
  <pre>
  &lt;link rel="stylesheet" href="/css/prettyPhoto.css" type="text/css" media="screen" charset="utf-8" />
  &lt;script src="/js/jquery.prettyPhoto2.js" type="text/javascript" charset="utf-8">
  
  &lt;script type="text/javascript" charset="utf-8">
    $(document).ready(function(){
      $("a[rel^='prettyPhoto']").prettyPhoto();
    });
  &lt;/script>
  
  
  &lt;a href="/course/play-video/topic_id/topic_id;?>?iframe=true&width=470&height=340" rel="prettyPhoto" title="topic_name;?>">
  &lt;img src="/images/videos/" width="170" height="103" alt="topic_name;?>"/>
  &lt;/a>
  
  </pre>
  
  <p>But how do I track when the user clicks on close and is there anyway to pass the topic id to that function
  Thanks much</p>