Adaptivate: Make Any Site Adaptive/Responsive

Adds Dynamic Classes Representing Current Page Width/Orientation to Any Element

If you want to make your site adaptive/responsive, but you don't want to deal with confusing CSS media queries like @media all and (max-width: 699px) and (min-width: 520px), then Adaptivate is for you. By including this jQuery plugin, you'll get dynamic classes like "width_lt_640 width_gt_480 width_eq_520 orientation_portrait". You can then target these in your CSS to have different styles for different browser window sizes.

The current matched width is exposed as a Javascript variable. Click to get current width
---
You can also bind to the "adaptivate" event. It gets fired when the window is finished resizing (not continuously like onresize). It gets the current width as an argument. Check out the div below when resizing the window.
---
This div will change colors when the page is resized. The boxes below only rotate when the window is wider than 640px