event:Selectors — Like Behaviour But Better

If you do any DOM Scripting, there's a good chance you’ve heard of the Behaviour library. Or, in case not, the basic idea is that the library allows developers to apply functions to elements or their event handlers through CSS selectors.

Behaviour is really cool and has made my life easier. All the same, a successor may be in the wings — event:Selectors is very similar but it adds pseudo-classes so that event handlers can be specified right in the selector. For example, you could have something like this:

'#icons a:mouseover': function(element) {
var app = element.id;
new Effect.BlindDown(app + '-content', {queue: 'end', duration: 0.2});
},

In addition to a less verbose syntax than Behaviour, event:Selectors also allows for comma-delimited selectors for a given rule (just like real CSS). Another difference is that event:Selectors makes use of the Prototype library. So, if a project you’re working on is already making use of Prototype, then event:Selectors ends up being a fairly lightweight addition; on the other hand, if you just need some one-off event handling stuff on a project which already isn't using Prototype, then Behaviour may be the leaner choice. Speaking for myself, though, I can’t wait to give it a try :).

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.