title: Unbind all mouseover events on window scroll
body: <p>I have tried this code:</p>
  
  <pre><code>$(function(){
      $('.media-in').bind('mouseover',function(){
          $(this).children('.media-options').show();
      });
      $('.media-in').bind('mouseout',function(){
          $(this).children('.media-options').hide();
      });
      $(window).on('scroll',function(){
          $('.media-in').unbind('mouseover');
      });
  });
  </code></pre>
  
  <p>It doesn't works as expected. I would like to <code>unbind</code> the event happening on <code>mouseover</code> when I scroll the page, how can I do that?</p>
  
  <p>Also, is there any way to <code>unbind</code> events on the page scrolling by array? Something like:</p>
  
  <pre><code>$(window).scroll(function(){ 
      $(this).unbind(['mouseover','click','mouseout']);
  });
  </code></pre>