Introduction

EventX is an unobtrusive JavaScript that separates behaviour from structure and presentation. It applies behaviour to elements using the commonly understood syntax of CSS. You can use it to attach dozens of behaviours to dozens of elements without inline code.

The script supports complex selectors (e.g., DIV.gallery A > IMG.thumbnail), proper cascade behaviour (as defined in REC-CSS1 and CSS21) and more.

Use CSS-Like Syntax to Attach Behaviour

A.popup { onclick: window.open(this.href); return false }

Remove Inline JavaScript

<a href="http://somesite" onclick="onclick: window.open(this.href); return false">Our Link</a>

Keep Your Markup Clean

<a class="popup" href="http://somesite">Our Link</a>

Update Site-Wide Behaviour Instantly

A.popup { onclick: window.open(this.href, "", "toolbar=no"); return false }

Learn How to Use EventX

• Principles — Basic ideas and usage.
• Examples — Simple and complex examples (with live demo).
• Reference — Detailed information on selectors, handlers, behaviours, cascade order, etc.

Download EventX

The EventX code alone is ~4k (minimized). The basic script is ~5.5k (including comments and class functions). Below you can download a distribution package that contains the script itself, a demo page and a blank HTML template to get started.

EventX_09.zip

Supports: IE5.01+, Firefox, Konqueror, Opera 7.5+, IE5 for Mac.

Changes for v0.9

• Pre-compiles heavily used regular expressions for faster rule parsing and cascade ordering (in browsers that support the RegExp compile method).
• Prevents Internet Explorer memory leaks.
• Determines cascade order immediately, rather than waiting for onload.
• New syntaxAlert option to check rule syntax (for setup and testing).

License

EventX_09.zip is distributed under a Creative Commons License and is Copyright 2005 Shawn Brown. The manner of attribution that I request is minimal: don't remove my copyright or contact information from code comments.

Version History

Version Number	Release Date	Features/Changes
0.9	10-Oct-2005	Faster rule parsing Faster cascade ordering IE memory leak prevention
0.8b	27-Jun-2005	Intelligent cascade: weight determined by specificity, declaration order and explicit flags Rules now stored in ruleSets array Supports !important declaration
0.8 (first release)	14-May-2005	CSS1 selector support Child (>) and sibling (+) selector support Rule weight determined by declaration order alone

When EventX was being actively developed, the next release was going to feature internal rule-grouping and more optimized DOM-tree walking. Currently, I recommend using a modern library like jQuery.