Skip to main content

10 jQuery Plugins to Help with Web Page Layouts

Every now and then a web project will come up that has special and unique layout requirements, and the current capabilities of CSS just aren’t enough. With projects such as these, jQuery can be your best friend. So here are 10 jQuery plugins to help you out with page layouts.

UI.Layout

jquery
The UI.Layout plug-in can create any UI look you want – from simple headers or sidebars, to a complex application with toolbars, menus, help-panels, status bars, sub-forms, etc.

mb.containerPlus

jquery
This plugin let’s you build full featured and fully skinnable containers. The container can be set to draggable, resizable, collapsable and minimizable.

css-template-layout

jquery
The project aims at providing web designers with a way to use the W3′s CSS Template Layout Module today. As a jQuery plug-in, the script parses a given set of CSS rules and displays the content as indicated in the specification. Options include the ability to select the CSS parsed, as well as an optional prefix to use for the CSS rules. Specifying a prefix allows style rules that are interoperable with a possible future browser implementations.

Masonry

jquery
Masonry is a layout plugin for jQuery. Think of it as the flip side of CSS floats. Whereas floating arranges elements horizontally then vertically, Masonry arranges elements vertically then horizontally according to a grid. The result minimizes vertical gaps between elements of varying height, just like a mason fitting stones in a wall.

Columnizer

jquery
Columnizer will automatically layout your content in newspaper column format. You can specify either column width or a static number of columns.

jQSlickWrap

jquery
jQSlickWrap forces text to wrap around the contents of an image, not just its bounding box as it does when you use a float with CSS.

Equal Heights

jquery
Equal Heights loops through the top-level child nodes of a specified element and sets their min-height values to that of the tallest.

js-columns

jquery
js-columns is designed to help with the creation of newspaper-style column layouts in HTML. While CSS3 has a variety of column-style properties, these are not yet widely implemented, and none help with the creation of page-based layouts.

Columnize

jquery
jQue­ry Co­lum­ni­ze al­lows you to crea­te a newspa­per-li­ke co­lumn lay­out.

jLayout

jquery
jLayout provides four layout algorithms for laying out HTML elements in web pages. This plugin allows you to lay out your elements with as little code as possible, and behaves correctly when used with margins, padding and borders.

Comments

Popular posts from this blog

Top 5 Women Who Impacted Technology in 2010

Katie Stanton, International Strategist for Twitter Katie Stanton has impressively long names of companies in her resume. They include the White House, Google Inc, and her latest addition is Twitter. Her remit is working on Twitter’s international strategy and her experience in social media will be a key asset to the company. Katie has a history of working in technology, and her knowledge of departmental laws will help Twitter work alongside government agencies, as she’ll be spearheading the free information approach, especially after the Wikileaks incident. Stanton has been a key player in the techsphere for some time, and this extends to her private life. Following the Haiti disaster she worked with a group of engineers to create a free texting service to help those in need and she is constantly in demand as an expert in both social media and government policy.
Caterina Fake, Co-Founder of Flickr and Hunch Despite having a surname which sounds like a pseudonym for a spy (it’…

AT&T MiFi 2372 review

In the week or so that I have been testing the AT&T MiFi 2372 by Novatel Wireless, it has already saved no less than three lives. First, it saved my cable guy’s life. You see, Time Warner Cable provides the worst home Internet service I have ever experienced. I can’t even think of a close second. If providing terrible home Internet service was a sport, Time Warner Cable would be on its tenth consecutive undefeated season. Forget the fact that my upload speed is capped at 60Kbps and I’m lucky if I can get half that — it has been months since I’ve gone through a full day without at least one service interruption. Months. Unfortunately, Time Warner Cable has an exclusive contract with my building so I have no choice but to endure its abysmal service. Last week, as a Time Warner Cable technician entered my home for the sixth time in two months, I realized that this certainly would have spelled serious trouble had it not been for my trusty new back up device. Before the Mi…

facebook vs google+