Using jQuery.resize to Enhance Responsive Design

Twitter Bootstrap provides some convenient grid scaffolding to use for responsive design applications. The xs-sm-md and lg classes allow you to adjust your design based on the screen real estate available. Sometimes, however, this isn’t enough. Recently when working on laying out a couple portlets horizontally on a page I discovered that I needed some additional control over the display (or lack thereof) of some columns in my portlets. In short, I wanted to hide some of those columns when the width of the screen was at a certain horizontal threshold. The standard bootstrap classes were not granular enough for my needs. Time for some jQuery wizardry.