JQuery Masonry - locking divs to move vertically only

First time poster, but I've used the site for quite a while and I've usually found the answer here somewhere. In this instance however I'm forced to actually ask.

JS is not my strong point so please bear with with. We have a web based application that has dashboard items. These are essentially divs which have specific content in them for that user (eg holiday, alerts, messages, etc). I've implemented Masonry to close up the white space as they all float naturally (no left and right columns).

The problem lies in that some of the dashboard items expand to show more data (this is currently handled by AJAX). Because Masonry fixes the height of the container and other elements this break the layout with elements going behind others rather than making more space.

Is there a way for items to move only vertically or maybe a means of telling Masonry that certain items should always be on the right or left?

Regards

<!-- Masonry --->
<script type="text/javascript" src="js/jquery.masonry开发者_StackOverflow社区.min.js"></script>
<script>
  $(function(){

    $('#Dashboard').masonry({
      itemSelector: '.DashboardItem',
      columnWidth : 480,
      isResizable : true
    });

  });
</script>

You'll probably have to call $('#Dashboard').masonry() yourself after resizing the items so that Masonry will reposition them. Usually it only does that when the browser's window resizes.