60+ 必须拥有的jQuery插件
一个强大的jQuery插件集合。几乎所有这些插件都是一个网页设计师需要拥有的。
这个jQuery插件集合包含了:图片库展示插件,排版插件,导航插件,幻灯片和相册插件和许多其他类型的插件。
Best jQuery Plugins for Image Galleries
Photo gallery is a need every second website. But as ever, creating impressive image galleries is no walk in the park…. but it can be so if you use these jQuery plugins. Most of these links do not include just a jQuery plugin but also its tutorial.
Responsive Thumbnail Gallery Plugin
This can work as slideshow as well, or a photo album. Depends on how you use it.
I loved this gallery. Versatile, stylish yet elegant.
A routine image gallery. Everybody needs it.
The above one was a routine kind of a gallery…. this one isn’t!
Flipping book style album.
Making a Really Cool jQuery Gallery
A custom gallery that scans a computer folder for images and creates a slick gallery using the images in the folder. It uses PHP, CSS3, jQuery and Lightbox plug-in.
This is somewhere in between a gallery and a slideshow, but since it takes up a full webpage, it will be considered a gallery.
The screenshot tells all about the output result so no need to define it.
SIDEWAYS – JQUERY FULLSCREEN IMAGE GALLERY
This gallery became very a popular a year ago. The reason being that it contains amazing effects and it is also perfect usability wise.
It is simple, yet elegantly stylish. Traditional stuff never goes out of style and that’s why this plugin is still a hit.
Polaroid effect is made by slightly rotating the images. It works as an album and as a gallery as well.
Best jQuery Plugins for Typography
At the beginning of the time, webpages didn’t have pictures at all… and that trend is coming back. That is because images cannot adjust according to screen resolution, nor are they search engine friendly.
On the other hand, text adjusts itself like water adjusts itself according to its contain. Text can squeeze, expand, move around, break and rejoin. These days every one is focusing on typography based flat designs for better usability.
Check out: Beginner’s Guide to Using Typography in Responsive Design
A cool little script that changes the content height/width to fit the best on the screen.
CSS doesn’t give complete down-to-the-letter controlling but no tension, we have jQuery for that. Lettering.js provides controls for:
- Kerning Type
- Editorial Design
- Manageable Code
- Complete Control
Kerning.js
CSS3, meet kerning. Kerning, meet CSS3. You can Kern, stylize, transform and scale your web
type with real CSS3 rules, automatically. All you have to do is add: in to your webpage.
Arctext.js
If you used any vector design software, you’d know what it means to fit text along a path. This plugin does exactly that. Fits your text along a arc, circle or such another shape.
jSlabify
If you’ve ever worked in newspapers, you’d know what slabbed text is.
Don’t know what slabbed text is? Check out the screenshots.
HATCHSHOW
This is my favorite jquery plugin related to typography. And I recommend you to use it.
Best jQuery Plugins for Photo Slideshow
These slideshows add ‘wow’ factor in your websites. But it’s not just about the ‘wow’ factor, a slider can add huge amount of user interactivity and that’s why they are loved by clients.
Rotating Image Slider with jQuery
I think the screenshot says it all. The shape and stacking of the pictures is where the beauty of this jquery plugin lies.
A lightweight multipurpose image slider.
Create Beautiful jQuery Slider Tutorial
This is a tutorial that explains how you can develop an impressive jQuery slider. Of course, you can get the code and use it as a plugin.
Create an Image Rotator with Description (CSS/jQuery)
This is a very useful image rotator, slideshow, featured content container etc. etc. etc.
It contains image size image, thumbnails of the rest, titles of the rest and image description as well as the title of the current slide.
Simple effect, highly interactive. Perfect for online magazines and large portals. You can also customize it as a image gallery.
Elastislide – A Responsive jQuery Carousel Plugin
This is a carousel, not particularly a slideshow but this can work as a slideshow strip so I added it.
Creating a Rotating Billboard System with jQuery and CSS
The vintage style of billboards in the sports stadiums.
jQuery Banner Rotator
I loved the navigation within this slideshow, and that navigation is the reason I added it in this list.
Best jQuery Plugins for Navigation
Navigation is the backbone of any web design. It is the hub of all interactivity with the user. And that’s why it has to be paid so much attention.
My suggestion is that in navigation, don’t go for style but usability. However, I’m adding navigation jQuery plugins for style as well as usability.
jQuery Facets
This isn’t really a navigation menu but a navigation panel. Check out the demos, you’ll know what I’m talking about.
Floating Social Toolbar With jQuery And CSS
This should be one of the perfect examples of jQuery plugins for navigation. This creates floating bar so it always has high visibility.
Create a Cool Animated Menu with jQuery
This contains Photoshop tutorial to learn how to design this menu, then coding tutorial for development of the tutorial and then it also includes downloads for both of these tutorials. Excellent resource for learning web designers.
NavDoc
This resource contains two types of impressively designed menus. Smooth Ajax adds the spark, blue is the color, rest is history.
Page Scroller
There’s a premium version which includes API and skins. otherwise its free.
Expanding Image Menu
This is another one of those navigation panels, this can be used to display featured content as well. You roll over the mouse pointer and it expands.
Elastic Thumbnail Menu
For giving the website a cool funky look, this navigation should be the very best solution.
Slide Down Box Menu
You can see the result navigation in the image, what else do I need to say
Outside the Box
If you are fed up with the routine kind of navigations, then go for this. This is nothing like routine. It is designed mimicking the Mac OS X styling.
Image Menu with jQuery
This is my favorite navigation menu from the selection. The image expands on mouse pointer hover. The text is very visible, large.
Best jQuery Plugins with Parallax Effect
Parallax has taken the web by storm. Everybody is talking about and everybody wants it in their website. These are a few plugins which you can easily add in any website add that parallax spark everyone is chasing.
By the way, published 50 Best Parallax Scrolling Examples, do check them out if you like parallax effect.
Women and programmers hate bugs. Probably different kind of bugs, but bugs nonetheless. I won’t go into details, just check out this plugin. It helps to control bugs.
A classical parallax scrolling effect. This is a plugin you could need when a client demands parallax effect and you don’t need a quick way to meed his/her demand.
You can find the live demo on the page. Just check out the header.
The best thing about this jquery plugin is that it is very well documented so you never have trouble of finding, fixing or editing and updating the code.
Excellent result, easy to implement. What else do you want?
Misc. jQuery Plugins
These are mixed types of jQuery plugins that can add a lot of usability and/or dynamism to your website.
It displays a large of the image on hover.
Displays various styles of hovers over images and albums.
liteAccordian
I loved this one for displaying featured content on a website.
Hover over any image and it slides away.
Almost like Cloud Zoom, but this one is a little funky while that one was pretty elegant.
Customize-able lightweight image/component loaders.
A lightweight plugin which adds a social media sharing bar.
A very cool animation effect. Works great on banners and objects that hover over the main web page (such as “follow us on 推ter”).
Cool form maker plugin with plenty of themes and styling options.
This little plugin stylizes quotation marks in your content.
jQuery filters that set the sorting order of the content.
A very unique plugin which describes using the website.
Apple.com like Search Suggestions
The title says it all…
Though I’m against using a custom player, since every one can recognize the 油Tube player but a custom player might be just a little confusing for the visitor… but nevertheless it sounds intriguing.