50 Most Useful Jquery Plugins of The Year #1

by admin Date: 23-08-2013 jquery resources tutorials tips plugins


With thousands (yes thousands...) of new jQuery plugins that have been released we have worked hard filtering down all of the those plugins to bring you the 50 that we feel are the most innovative and useful.

We have split all of the plugins into the following categories: Web Page Layout Plugins, Navigation Plugins, Form Plugins, Slider & Carousel Plugins, Chart & Graph Plugins, Image Effect Plugins, Video Plugins, and finally, everything else in-between.

Enjoy the first category: Web Page Layout Plugins

1. equalize.js

 

 

The jQuery plugin for equalizing the height or width of elements. Equalize will now accept a settings object to get the "minimum max dimension". By setting reset to true the height/width will be removed before determining the max.

2. Freetile.js

 

Freetile is a plugin for jQuery that enables the organization of webpage content in an efficient, dynamic and responsive layout. It can be applied to a container element and it will attempt to arrange it's children in a layout that makes optimal use of screen space, by "packing" them in a tight arrangement. Freetile has been the layout engine behind Assemblage and Assemblage Plus for almost two years, and now it becomes available as an independent Open Source project.

3. gridster.js

 

Gridster is a jQuery plugin that allows building intuitive draggable layouts from elements spanning multiple columns. You can even dynamically add and remove elements from the grid. It is on par with sliced bread, or possibly better. MIT licensed.

4. Zoomooz.js

 

Zoomooz is a jQuery plugin for making web page elements zoom. It can be used for making Prezi like slideshows and for zooming to images or other details. Zoomooz uses a smart easing that works the same way as css animation easings. If you'd like to use it with other jQuery animations, check out jquery.easie.js.

5. Wookmark

 

Wookmark is a plugin for creating a dynamic, multi-column layouts. It lays out a series of elements in a dynamic column grid.

6. jQuery HiddenPosition

This plugin works exactly (at least in our intentions) as position plugin from jQuery UI. The need for this plugin raised from the fact that it doesn't work with hidden elements, and in some cases we prefered to position them before showing. Since we still use jQuery UI where we don't need to position anything hidden or any of the additional options, this plugin is built so that it can use the exact same option input, this way you just need to change your code from $().position({options...}); to $().hiddenPosition({options...});. The inverse is true unless you are using one of the few additional options, like viewport setting. Another big difference is that HiddenPosition works well even with position:relative elements, so take that into account if you need to go back to jQuery UI.

7. Stellar.js

 

Parallax has never been easier. Stellar.js is a jQuery plugin that provides parallax scrolling effects to any scrolling element. Add some simple data attributes to your markup, run $.stellar(). That's all you need to get started.

8. turn.js

Turn.js is a JavaScript library that will make your content look like a real book or magazine using all the advantages of HTML5. The web is getting beautiful with new user interfaces based in HTML5; turn.js is the best fit for a magazine, book or catalog based in HTML5.

9. Responsive Measure

Responsive Measure is a simple script that allows you to pass in a selector which generates the ideal font size needed to produce the ideal measure for your text.

10. jQuery Scroll Path

jQuery Scroll Path is a plugin that lets you define your own custom scroll path. What this means exactly is best understood by checking out the demo. The plugin uses canvas flavored syntax for drawing paths, using the methods moveTo, lineTo and arc. To help with getting the path right, a canvas overlay with the path can be enabled when initializing the plugin.

Scrolling can be done with the mousewheel, up/down arrow keys and spacebar. The spacebar scrolls faster than the arrow keys, and holding shift while pressing space will scroll backwards. A custom scrollbar is also included, which allows click and drag scrolling. The scrollbar is enabled by default.

The plugin also allows rotating the entire page, using CSS transforms. This can be done either along a path, or around the current position. In browsers without CSS transform support, all rotations are ignored, but paths are still followed. This means the plugin works with graceful degradation in all browsers.

As of version 1.1, the plugin also allows you to animate the scroll position to a given waypoint in the path.

 

 
by admin Date: 23-08-2013 jquery resources tutorials tips plugins hits : 10586  
 
 
 
 

Related Posts

    How To Grow Your Small Business

    A business that stays still will stagnate. To be successful and to have a business to be proud of, you need to ensure that it grows. This is not always…

    Level Up Your JavaScript Skills: 12 basic notions

    If you are a developer at any level, understanding its basic concepts is crucial. This article highlights 12 basic concepts that are critical to understanding by any JS developer, but do…

    Is jQuery going to die in 2019?

    For a while, JQuery's relevance has been a topic of debate among web developers. We were curious as web developers interested in Javascript to know what others have to say…

    Best 5 Javascript NewsTicker Plugins

    Not all developers know the marquee tag of HTML, that allows you to create a scrolling piece of text or image displayed that is shown horizontally or vertically on the DOM.…

    Best Javascript front-end hacking cheatsheets

    JavaScript has a extremely high potential to build cutting-edge web applications. But it's really hard to memorize it by heart. The JavaScript cheat sheets therefore act perfectly as a reminder…

    Tips for JavaScript Developers in 2019

    Another year is over and JavaScript is constantly changing. However, there are some tips that can help you write in 2019 clean and efficient code that scales. Below is a…

    Working with JSON in JavaScript

    JSON is short for JavaScript Object Notation and an easy - to - access way to store information. In short, it gives us a collection of human - readable data…

    JavaScript Basis: Syntax & Structure

    Programming languages are defined by rules. The syntax is what we follow when we write our code, which forms the logical structure of our programs. Let's dive right into the basic…

    Crazy SEO Tips For 2019

    Are you interested in learning more about SEO in 2019? Here are the trends you need to follow to improve your search optimization skills. For those who don’t know about SEO,…

    Top 10 JavaScript Books 2019

    Though simple for beginners to pick up and play with, JavaScript is a flexible, complex language that you can use to build full-scale applications. If you're an aspiring web developer then…

    6 JavaScript Utility Libraries you Should Know in 2019

    Nowadays Javascript is the most popular and widely used programming language, so the ecosystem around it constantly grows. However, it is expected that the small "standard library" of Javascript will remain…

    The Most Useful 50 Web Sites you wish you knew earlier

    There are so many websites around, and it is very complicated to know each and every one of them. Our lisy provides 100 those websites that we find particularly helpful,…



We use our own cookies and third-party cookies to improve our services, show products based on your preferences, analyse the browsing habits of our users, and enable interaction with social networks. Continuing to browse our sites implies full acceptance of their use. You can change your cookie setting or get more information here: Cookies policy .