20 Simple jQuery Tricks
jQuery has quickly made it’s way into nearly every web developer’s bag of tricks. The simplicity with which jQuery allows us to handle complicated events and perform smooth animations makes it the perfect tool for both beginners and experienced developers to add professional flair to their sites.
Get unlimited downloads of 2 million+ design resources, themes, templates, photos, graphics and more. Envato Elements starts at $16 per month, and is the best creative subscription we've ever seen.
Shopify, Tumblr & More
Logos, Print & Mockups
PowerPoint & Keynote
Landing Pages & Email
Icons, Vectors & More
Sans Serif, Script & More
Just to get you started off right, here are the beginner tutorials straight from jQuery.com.
A short post from “15 Days of jQuery” on using the wrap, prepend, and append functions to create a rounded corner effect.
3 Simple methods of cross fading one image into another using jQuery and CSS.
Chris Coyier provides some of the best free content out there for learning web design. Here’s one of many jQuery tutorials on his site.
Learn to create a slick, animated UI for your site with this step by step tutorial.
An oldie but goodie, this was one of the first tutorials ever posted on NetTuts. This is where I first learned about jQuery!
Learn how to use both the Twitter API and jQuery to create a great looking Twitter ticker.
This article shows you how to create a really smooth, vertically scrolling menu. A great tutorial despite the fact that the author seemed to think it was a horizontally scrolling menu!
Mimic Abduzeedo’s new site and to create a switch for changing your content from list view to grid view.
A great beginner’s tutorial describing how to use the toggle feature.
A well written, in-depth look at creating a WordPress form without the need of an additional plugin.
Use jQuery to take the monotony out of coding sequential items.
Having social media share links on your site has quickly become a standard for most blogs. Use this tutorial to make yours standout.
Use this stunning content slider to put a ton of content in a small space.
Create eye-catching background animations with only a few lines of code.
Similar in concept to #14 but with a subtler, more sophisticated effect.
An amazing technique for creating website navigation that mimics the OS X dock.
A quick and easy news ticker from Antonio Lupetti.
This tutorial shows you how to create a popup window and fade out the background.
Learn to create simple and effective RSS feed menus like those in Safari.
This tutorials walks you through creating an incredibly unique sliding 3D background effect.
That’s All Folks
That concludes our roundup of simple jQuery tricks. Now go and use these techniques to create some amazing effects on your site. Leave a comment using the field below to share your favorite jQuery tricks and tutorials.