javascript

CHAPTER 10 ■ SCRIPTING BOM
422
} :
function () {
var elements = findClass("sprite"), sprites = {};
for (var i = elements.length, offsets = null, member; i --; ) {
member = elements[i].id || elements[i].className;
if (! sprites[member]) {
sprites[member] = [];
offsets = [queryCascade(elements[i], "backgroundPositionX"), queryCascade(elements[i],
"backgroundPositionY")];
sprites[member][0] = offsets.join(" ");
sprites[member][1] = 1 - parseInt(queryCascade(elements[i], "width")) + "px " +
offsets[1];
}
addListener(elements[i], "mouseover", slideSprite);
addListener(elements[i], "mouseout", slideSprite);
}
function slideSprite() {
var e = window.event;
if (e.type == "mouseover") {
e.srcElement.style.backgroundPosition = sprites[e.srcElement.id ||
e.srcElement.className][1];
} else {
e.srcElement.style.backgroundPosition = sprites[e.srcElement.id ||
e.srcElement.className][0];
}
}
} ;
Save ten.js, refresh ten.html in Firefox, and put the arrows, which are swapped by class, and the
running links, which are swapped by ID, through the wringer. Verify your work with Figure 10–2.
Figure 10–2. The scroller works fine, now.
Everything work fine now? Great, now on to scripting HTTP.