title: horizontal bar drag between stacked divs using jquery
body: <p>So I have two divs above and below each other. The one on top is the content area and the one below is a notes section about the content. I'd like to put an invisible bar in between the two divs where I can drag the height of the two divs. If possible I'd also like to snap to the top or bottom. </p>
  
  <p>I'll attach an example of the current look but the design can change as long as the classes stay the same in the html. Any help appreciated. Thanks!</p>
  
  <pre><code>jsfiddle.net/jv4edcc4/
  </code></pre>