Hostinicon
GET HOSTING FROM $3.95/MO PLUS A FREE YEAR ON TUTS+ (RRP $180). HURRY OFFER LIMITED. Check it out
Advertisement

Quick Tip: Different Layouts for Different Widths

by
Gift

Get a free year on Tuts+ this month when you purchase a Siteground hosting plan from $3.95/mo

It's becoming more and more common for web sites and applications to provide different layouts dependent upon the user's window size, or resolution. This can be accomplished in a variety of ways, ranging from CSS to JavaScript solutions.

In this video quick tip, we'll learn how laughably simple it is to do this with a touch of jQuery, and the resize() method.

By utilizing jQuery's "resize()" method, we can easily listen for when the user changes the width of their browser window.

Then, subsequently, we target our desired CSS properties accordingly.

Advertisement