E-Books for you

Animating elements
Extending the Animation Class
With the basic animation object in place, you can create a class that tackles a specific need.
Suppose you have a set of frequently asked questions (FAQ) on your page that continue down
the page like this: question??”answer??”question??”answer.
The animation object on its own doesn??™t quite have everything you need. First and foremost,
you need to be able to remember the height of the object so that you know how big to
make it again after you??™ve hidden the answer. Also, because the object has only two states??”
open or closed??”you??™ll keep track of the state you??™re in and toggle between them.
Call the new class Toggler, which will take just one argument: the element that will control
the toggle:
function Toggler(element){ }
Take a quick look at what the HTML for this FAQ would look like. Each question has a
class name of question. In this example, each answer has a class name of answer, but it??™s not
really necessary (as you??™ll see in a moment):








When the window loads, you need to get all the question elements and create new
Toggler options with each one.


Pages:
187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211