Forms, Buttons & Navigation
Making a Google Wave History Slider
Here is shown how to create a Google Wave-like history slider. Using it will enable visitors to go back and forth in time to view the changes that take place on a comment thread.
Creative Button Animations with Sprites and JQuery
jQuery MagicLine Navigation
These “sliding” style navigation bars have been around a while, and turns out it’s really pretty darn easy. Here are put two examples together.
Fixed Fade Out Menu: A CSS and jQuery Tutorial
The aim is to have a fixed navigation that follows the user when he scrolls, and only subtly showing itself by fading out and becoming almost transparent. When the user hovers over it, the menu then becomes opaque again. Inside of the navigation we will have some links, a search input and a top and bottom button that let the user navigate to the top or the bottom of the page.
Useful jQuery Plugins
Roundabout is a jQuery plugin that converts a structure of static HTML elements into a highly customizable turntable-like interactive area. (And now, not just turntables, but many shapes!)
jQuery Quicksand plugin
Reorder and filter items with a nice shuffling animation.
Minimalist jQuery: 11 useful plugins under 4K
jQuery makes our lives easier. So much so that it’s tempting to use it all the time, inadvertently slowing our page load times (cue YSlow and Hammerhead). Combining, compressing, and delivering scripts at the end of your page helps in the HTTP request department. On the file size front, below are jQuery plugins that give solid bang for your performance buck.
Undo/Redo in jQuery
An easy-to-use plugin for adding undo/redo capabilities to a jQuery application. It is based loosely on the Objective-C/Cocoa way of doing things.
editEase – jQuery CMS | no fuss, no database, no worries
Script surrounding the search term(s) with the
mark element rather than a
span, although the class searchword is retained in case you want to style these
marks differently from others. In the CSS, the rule
article mark is just added to turn it a gentle shade of pink.
10 Really Helpful Traversing Functions in jQuery
With jQuery, selecting HTML elements is laughably easy. But at times, we may wish to further refine the selection, which can be a hassle when the HTML structure is complicated. In this tutorial, we’ll explore ten ways that we can refine and extend a set of wrapped elements that we wish to operate upon.
jQuery – Select element cheat sheet
This cheat sheet helps you to find the index of a selected option, set the selected option by value, set the selected option by text, insert a new option before or after another and get the text or value of the selected option.
A compilation of best practices and good advice I’ve amassed over the years, much of it learnt the hard way (experimentation and suchlike). Take the advice below to heart and keep it in a part of your brain that has a quick access route so you can apply it without thinking about it. I am sure you will find things to disagree with, and that is a good thing – you should question what you read, and strive to find better solutions. However, I have found that following these principles has made me a more effective developer and allowed other developers to build upon my work more easily.