30+ Brand New jQuery Plugins To Change the Look and Feel of Your Website
There are many people looking for some jQuery plugins not only for inspiration but also should be useful for further needed! You could find a bunch of new plugins for jQuery out there which can be helpful for your next projects. In this round up, we will continue to take advantage of its magic. 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.
JFormVal is a newest jQuery Plugin for form validation. The plugin supports many ways to validate the form in just one line code. If you are working on a multi languages web site project, you definitely love it because it comes with a bundle for error messages in different languages. Easy to config and easy to use! See the code example:
jQuery 2D Transformation Plugin
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:
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 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 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
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!!.
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!
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 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
This plugin takes a few CSS3 techniques which are:
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
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.
jQuery Constant Footer
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
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.
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
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.
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.
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
I was really confused about the name of this plugin the first time. It should be called lightbox effect rather than zoom effect because this the 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.
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 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.
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.only css and js,no background images. – according to the author.
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.
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!
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
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.