MooTools allows us to queue up functions within an array so that each function can be called, one after the other. This is referred to as chaining. This recipe is about making a chain and then using a listener to start the chain rolling.
Create a small array of numbers that can be used by our script, each one made bold in sequence.
<div id="numbers"> <span>1</span> <span>2</span> <span>3</span> <span>4</span> <span>5</span> <span>6</span> <span>7</span></div>
Define, for quick reuse, my_numbers as var my_numbers = $$('#numbers span');. Next, create a function that will advance the bold, black highlight to the next number, or start at "1" if none is active.
var advance_one_number = function() {
var next_number = -1;
my_numbers.each(function(el,index) {
if (el.hasClass('next-in-chain')) {
next_number = index.toInt();
}
el.removeClass...