Brandon's Archive

Quick Tip: Add Easing to Your Animations

Easing can really bring life to an effect. Easing controls how an animation progresses over time by manipulating its acceleration. jQuery has two built-in easing methods: linear and swing. While they get the job done, they are pretty boring when compared to what’s made available through the jQuery easing plugin.

The jQuery easing plugin offers 30 different easing methods, courtesy of Robert Penner’s easing equations. Let’s check some of them out.

Read the rest of this entry »

Quick Tip: Prevent Animation Queue Buildup

You’ve probably stumbled upon a navigation powered by some jQuery effects during your web adventures. Of course you then ran your mouse back and forth over the navigation really fast to watch the animation repeat itself over and over and over again.

The natural queuing of animations/effects by jQuery makes the typical animation super easy to code and move on to more important tasks. However, sometimes the animation queue just gets in the way.

Read the rest of this entry »

Namespace Your Events

A common pattern in jQuery plugin development is the need to undo what the plugin has done. This is usually handled through a method prefixed with “un”. Another common pattern is the use of anonymous functions for event handlers. Unbinding events is easy with jQuery but unbinding a single event handler requires the use of a named function. jQuery 1.2 now provides another option for binding and unbinding events: event namespaces.

Read the rest of this entry »

Selecting Elements by Properties and DOM Expandos

Sometimes it is very convenient to store information on an element by using custom properties (DOM Expandos). For example, I use DOM Expandos in my Mouse Wheel plugin to store an array of handler methods (_mwHandlers) along with a method (_mwHandler) to call all those handlers when the mouse wheel is used. Storing these methods on the element allows me to write less code, and manage scope easier. It also gives me a function reference for easy removal when needed.

Now, what if I needed to select all elements that have a mouse wheel handler on them?

Read the rest of this entry »

Copy Events from One Element to Another

Need to clone an element and its events? Sure, you could rebind the events after doing the clone, but that wouldn’t be very DRY now, would it? Introducing Copy Events, a new plugin for jQuery.

Read the rest of this entry »