Thomas Fuchs
Hi, I'm Thomas Fuchs. I'm the author of Zepto.js, of script.aculo.us, and I'm a Ruby on Rails core alumnus. With Amy Hoy I'm building cheerful software, like Noko Time Tracking and Every Time Zone and write books like Retinafy.me.
   Want me to speak at your conference? Contact me!

event:Selectors for Prototype

March 21st, 2006

Justin Palmer has released event:Selectors, a method to cleanly use CSS pseudo selectors to assign DOM events to elements on the page.

It’s inspired by behaviour.js, but builds on all the latest Prototype goodness and adds some nice new features.

Here’s a snippet of what you can do (notice how nicely it works together with script.aculo.us!):


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

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

Examples for multiple assignments and event passing:


'#feature, #otherstuff': function(element) {
  Sortable.create(element);
}

'.links a:click': function(element, event) {
  $('item').toggle();
  Event.stop(event);
}

Update: Here’s the official announcement from Justin – and shame on me for leaking 🙂