[jQuery]30+ Brand New jQuery Plugins To Change the Look and Feel of Your Website
原文地址:http://aext.net/2010/08/jquery-plugins-to-change-the-look-and-feel-of-your-website/
这是一份非不错的jQuery插件资源
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
jFormVal
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:
<script type="text/javascript">
jQuery('#i01').valText('City').min(1).dif('Chicago').max(20).err('#dv1');
</script>
...
<form>
<div id="dv1">
<input type="text' id="i01" name="country" />
<input type="text' id="i01" name="city" />
<input type="submit" />
</div>
</form>
jQuery 2D Transformation 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
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.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
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
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
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
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: rotate
, border-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
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
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.
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
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
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
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
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
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
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.
Advertisement
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 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
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
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
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
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.
出处:http://justinw.cnblogs.com/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。