Jonathan Snook, Aaron Gustafson, Stuart Langridge, and Dan Webb
"Accelerated DOM Scripting with Ajax, APIs, and Libraries"
open_
items array. Since you??™ll use this method on both open and close, you??™ll pass the
method a reference to the dd whose animation just completed. If its id matches
FAQ.to_open, you know it is the newly opened dd and can add it to the FAQ.open_items
array using Array.push(). If not, it has just closed, and you can remove it from the
array using Prototype??™s Array.without():
CHAPTER 8 n CASE STUDY: FAQ FACELIFT 181
complete: function( dd ){
trace( 'transition complete' );
var id = dd.getAttribute( 'id' );
if( this.to_open == id ){
this.open_items.push( id );
} else {
this.open_items = this.open_items.without( id );
}
},
5. Save your work and refresh the browser. Upon clicking the first question, you should
see it slide open. Click the second question; the first will slide shut while the second
slides open. Now, click the last question; this one is a test of the referencing link event.
When it opens, click the link inside; you should see the answer to the first question
open, but the one you started from will not have closed, just as you planned. Clicking
another question will close those two and open the new one, and so on.
nTip If the animation looks a little choppy to you, try commenting out the