6 Powerful jQuery Plugins to Create and Enhance Website Layout

Written by Kevin Liew on 31 May 2011
68,834 Views • Javascript

Introduction

Javascript has opened wide possibilities of what you can do with HTML and CSS. Well, we have HTML5 and CSS3, pretty sure it can do more than before, but with a magical touch from Javascript, it can add interactive elements into your website layout. Take jQuery Masonry (listed below) as an example, it converts a normal layout into a really cool fluid layout with auto align of each items to form a clean and neat layout.

Without further ado, check out these 6 javascript plugins that will help you to create a complicated web layout.

  • UI.Layout 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.
  • jQUery Masonry A dynamic layout plugin for jQuery. The flip-side of CSS floats
  • jLayout The jLayout jQuery plugin provides four layout algorithms for laying out HTML elements in web pages.
  • jQuery pageSlide Query pageSlide was inspired by the UI work of Aza Raskin. In his recent posts regarding concepts for Firefox Mobile and a mouse-based Ubiquity, Aza introduced the idea of sliding (or "throwing") content aside to reveal a secondary content pane.
  • jQSlickWrap jQSlickWrap is a plugin for jQuery which enables you to easily and accurately wrap your text around the content of floated images.
  • Columnizer The Columnizer jQuery Plugin will automatically layout your content in newspaper column format. You can specify either column width or a static number of columns. And, of course, it’s easy to use!
By Kevin Liew

Kevin Liew is a web designer and developer and keen on contributing to the web development industry. He loves frontend development and absolutely amazed by jQuery. Feel free to say hi to me, or follow @quenesswebblog on twitter.

Related Articles
6 Brand New jQuery Image Galleries and Sliders
jQuery Textext - Tags, Autocomplete, AJAX Support for Input Field
Join the discussion

Comments will be moderated and rel="nofollow" will be added to all links. You can wrap your coding with [code][/code] to make use of built-in syntax highlighter.

1 comment
BENTLEYYvonne 12 years ago
Don't have a lot of cash to buy some real estate? Worry not, just because that is possible to receive the <a href="http://goodfinance-blog.com ">loans</a> to resolve all the problems. So take a credit loan to buy everything you need.
Reply