Monday, August 16, 2010

40+ New Brand jQuery Plugins

There are many people looking for some jQuery plugins not only for inspiration but also should be useful for further needed! The apparent abundance of plugins available on the other hand does not stop creative and skilled developers from creating even more goodies for the jQuery community, Thanks You all for contributing! This is a round up of some really great plugins which are not referred yet and you properly missed. Together with some CSS3 features, jQuery can refresh your web site design by changing the look and feel with no more boring.


jQuery 2D Transformation Plugin

jQuery 2D Transform Plugin
This plugin uses CSS3 transform effects to help you apply these effects to all browsers which support CSS3. Don’t worry about Internet Explorer, this script works well on IE 5.5+. You can use this plugin as a javascript animation library for any project.

jQnotice

jqnotice
A little small plugin for jQuery that allows you to show some notifications at the top of your website with just a simple line. You can use it by just call the following method:
jQnotice('Your notification');
Awesome!!!

jQuery color plugin xcolor

This plugin implements an extensiv color parser and a featureful set of color-manipulation methods. This color picker plugin passes the color value in different color models: RGB, HSV/HSB, HSL and their adequate alpha extensions. In default, this plugin use getHex() method to returns the color as Hex string. Pretty cool, huh?

jQuery Validity Plugin for Form Validation

jQuery Validaty Form Validation
“jQuery.validity is an elegant and powerful jQuery plug-in” which is lightweight. The JavaScript is only 9KB, but it can set up a total control for client-side form validation.

jQuery FormLabels Plugin

jQuery FormLabels Plugin
Another awesome jQuery plugin to make caption for input fields. This jQuery plugin uses the form label as a caption. However, you have to implement jQuery UI for the plugin works.

QuickFlip 2

QuickFlip works as the name. It’s very easy to implement and it provides an attractive alternative to other slower and more resource heavy Flash and jQuery flip animations. This plugin is really an effective way to flip content panel.

Unlimited Scroll using the Twitter API

Unlimited Scroll jQuery Plugin
It’s actually not a completed jQuery plugin but you can try to follow this quick tutorial to create your own plugin that can implement the unlimited scroll bar for any pagination needed. This is really a nice technique!!.

Canimate

Canimate
With Canimate, you can take any series of images and, using the Canimate naming convention, have them animate at any speed. You can treat the element that holds the image just like any other, including giving it borders, dragging it, etc. Give it a try!

Lumebox

Lumebox Plugin
This is an alternative lightbox script for jQuery which can parse the RSS of the post or page of your blog then displays images inside them (off course only with specific image group you defined). The script will open the image in popup just like other lightbox scripts.

Pines Notify jQuery Plugin

Pines Notify jQuery Plugin
Pines Notify is a flexible jQuery notification plugin which is very easy to implement and having bunch of option for developers to display any kind of notification. The script is fully customizable since it uses the jQuery UI CSS library for styling.

Crazy Dots – jQuery Plugin

Crazy dot jquery plugin
This plugin takes a few CSS3 techniques which are: rotateborder-radius, and linear-gradients to make an ajax loader like effect. The plugin works even with IE browsers(depends on jQuery 2D Transformation Plugin above). If you haven’t seen my tutorial which can do the same effect in 5 lines of jQuery, you can catch it here: Shadow Motion Effect in 5 Lines Of jQuery.

jQuery Apple-like Retina Effect

Apple-like Retina Effect With jQuery
Inspired by Apple iPhone 4 promotion page but after publishing this tutorial, Apple already implemented this effect to their product feature page here. The tutorial show us how to implement a nice effect which can zoom-in the content in a magnifier. You can follow this tutorial to build a jQuery plugin for your own project.

CrossSlide

If you are still want to implement a simple product slide-show with the help of Flash, you should think again. With CrossSlide jQuery plugin, in 2kB of Javascript code, it can create a few different effects, depending on how it’s called.

jQuery Constant Footer

Constant Footer jQuery Plugin
This plugins will convert a static HTML footer into a fixed-position footer that is glued to the bottom of the browser window. The feature that I like much is you can parse the feed and display as a stories on the footer which is really useful for blogs, magazines…

Beautiful Photo Stack Gallery with jQuery and CSS3

Beautiful Photo Stack Gallery with jQuery and CSS3
A fresh idea for a photo gallery. The idea is to show the albums as a slider, but in the stack view. We can browse through the images by putting the top most image behind all the stack with a slick animation. However, the plugin works if you use a Webkit browser like Chrome or Safari because of some Webkit properties. However, if you use it together with jQuery 2D Transformation Plugin above, you won’t worry about cross browser compatibility anymore.

Blur Gallery

Blur Gallery
This is little plugin for soft image blur effect on page load (and ‘clear’ on hover/rollover). The idea is pretty cool, the way to make blur effect is duplicating the original image to many then set opacity for each copy.

jQuery content feature like MailChimp

jQuery content feature like MailChimp
This tutorial will show us how to build a content feature like MailChimp. MailChimp had changed their homepage with great design and integrating a slick full page slider. The plugin is using jQuery Cycle plugin to scroll images.

jQuery Radmenu Plugin

Radial Menu jQuery Plugin
This is a circular contextual menu jQuery plugin. The radmenu plugin essentially builds items around the circumference of a circle and the location of the menu items can be easily memorized by novice users, as well as experienced ones.

Colortip – a jQuery Tooltip Plugin

Colortip JQuery Plugin
Yet another jQuery tooltip plugin which uses the title attributes of elements as a series of colorful tooltips. Six color themes are available, so you can easily match it with the rest of your design. Not much different to other plugins we knew, but it’s just fancy.

jQuery Ajax Poll

jQuery Ajax Poll
In a complete tutorial, the author explains in detail how to make an ajax-based poll system with PHP, MySQL and jQuery. You can simply take the javascript part and this script can be implemented to any website quickly to interact with PHP and MySQL to create an ajax-based poll system.

jTweetsAnywhere

jQuery Twitter Widget with @Anywhere support
jTweetsAnywhere is a jQuery Twitter Widget that simplifies the integration of Twitter services into your site. The scripts comes with a bunch of features; As its name, you can implement an almost complete Twitter with just few lines of Javascript.

Nivo Zoom

Nivo Zoom
I was really confused about the name of this plugin the first time. It should be called lightbox effect rather than zoomhe plugin allows you to display the images larger just like some other lightbox scripts. It’s just simple and effective with 5 different zoom(???) types. You can also add caption for each image displayed. It works on all modern web browsers: Internet Explorer 7+, Firefox 3+, Google Chrome 4, and Safari 4.

Cloud Zoom

Cloud Zoom
Now, this is a truly zoom one. Cloud Zoom plugin has smoothing effects: fade in/out zoom, soft focus zoom … especially the tint zoom feature is a good idea to help us focus on the area.

AeroWindow – Plugin for jQuery

AeroWindow - Plugin for jQuery
AeroWindow generates very cool Boxes in the Aero Style, inspired by the style of Window7. The popup window offers the usual options and full functionality similar to Windows modal windows.

jDesktop

jDesktop
It’s a complete framework for making desktop-like environment in a web browser with very cool effects and animations. Remember to check the “Go 3D” effects to see how awesome it is.

Simple unlimited levels vertical drop down navigation menu jquery plugin

Simple unlimited levels vertical drop down navigation menu jquery plugin
Simple unlimited levels vertical drop down navigation menu jquery plugin.only css and js,no background images.– according to the author.

gvChart

gvChart plugin – jQuery with Google Charts
gvChart uses Google Charts API to create interactive visualization by using data from the HTML table tag. There are five types of the charts at your choice: AreaChart, LineChart, BarChart, ColumnChart and PieChart.

BubbleUp jQuery Menu Plugin

jQuery Menu BubbleUp
This is my plugin which can zoom in and zoom out your menu images (or for a social network bar like what I did in the example). Although this effect isn’t a smooth and it is not as good as Mac Dock menu, it’s enough for a nice looking menu with tooltip.

ezMark: jQuery Checkbox & Radiobutton Plugin

ezMark is a tiny jQuery Plugin which can help you to stylize Radio button and Checkbox easily. The script works on all major browsers: IE 6/7/8, Firefox, Safari, Chrome.

CSS3 Rounded Image With jQuery

This one is actually a small trick of jQuery which does the magic tag wrapping the image to generate a rounded border and inner shadow by wrapping a span tag around with the original image as a background-image. Nice trick!

ShowLoading

ShowLoading
This plugin is designed to show a loading image over a specific area of the screen (e.g. a specific div or other dom element) while an ajax request is running. ShowLoading could come in handy on several projects.

UI Elements: Search Box with Filter and Large Drop Down Menu

Search box with filter UI element
A search box with a filter has a slick looking details. This search box will reveal a drop down menu after the user clicks into the input field when implemented to the page. With the filter built-in, users can select options for searching.
A good option for sites with a lot of navigation items. It’s such a sexy mega drop down menu element you should use.
You can download them here included their demonstrations.



gMap jQuery plugin




great new jquery plugins
gMap is a lightweight jQuery plugin that helps you embed Google Maps into your website. With only 2 KB in size it is very flexible and highly customizable. Now there’s NO excuse for not using maps… with jQuery its has been made easy for anyone.



JQuery Multiselect Plugin



great new jquery plugins
This is a jQuery MultiSelect Plugin that focus on speed and ThemeRoller support. It turns an ordinary HTML select control into an elegant drop down list of checkboxes. The plugins provides an optional header with check all / uncheck all / close links, Keyboard support, Ability to hook into 5 different event callbacks, much more and it is only 6kb minified.




Uniform




great new jquery plugins
Have you ever wished you could style check boxes, drop down menus, radio buttons, and file upload inputs? Ever wished you could control the look and feel of your form elements between all browsers? If so, Uniform is your new best friend. Uniform masks your standard form controls with custom themed controls. It works in sync with your real form elements to ensure accessibility and compatibility.




jQuery Formwizard Plugin


great new jquery plugins
The form wizard plugin is a jQuery plugin which can be used to create wizard like page flows for forms without having to reload the page in between wizard steps. The plugin is unobtrusive and gives the developer great freedom on how they set up the flow of the different steps in their wizards, as the plugin supports creating specific routes in the form; depending on the user input. Supports multiple “submit”-steps and much more.



Sliding Labels


great new jquery plugins
This plugin solves a common problem in an really new way. It has become popular to put  form labels into the fields – because it look great. Problem is that once users click a field the label is gone and it can be difficult to remember if you put in the right content in to each field… This plugin lets you have nice looking forms and simply slides the label out once the form is taken into use.



Twitter-like dynamic character count


great new jquery plugins
The best way to explain what this plugin does is to mention Twitter. Twitter posts are limited to 140 characters. While typing the Twitter post there is this always present information about how many characters the users have before reaching the limit. The information is not only provided merely by displaying a number, there are different colors applied to certain stages to notify the user about the status.



jQuery PhotoShoot Plugin


great new jquery plugins
The jQuery PhotoShoot plugin gives you the ability to convert any div on your web page into a photo shooting effect, complete with a view finder. You can check out the demonstration, or a nice tutorial on how to use it here.



Photo Tagging with Jquery 


great new jquery plugins
The jQuery Photo Tagger plugin allows you to add Flickr-style photo tagging to your images. You can create box-like overlays on top of your image and assign messages to each box. The plugin communicates with the server using the supplied API URLs such that the photo tags can be saved, persisted, and deleted when needed.



Sweet Cool Ajax Tabs with jquery & CSS3


great new jquery plugins
Organizing the content of a page in a both intuitive and eye-catching manner, is a must in modern web design. One principle that has been around for some time is dividing text into tabs. This is a AJAX-powered tab page with CSS3 and the newly released version 1.4 of jQuery.



jQuery Easy Slides


great new jquery plugins
jQuery Easy Slides is as the name designate really really simple to use and still look great. You need to set up a few parameters (where to pick up images, captions, etc.) and then you need one line of Javascript.. that’s it.



A jQuery Heat Map


great new jquery plugins
Here is a very simple way ho to create a heat map with jQuery. The idea is to track the clicks of a user and then display the click pattern with semi-transparent dots on an overlay.

No comments:

Post a Comment