Additional CSS scripts

As the examples get more complicated and you need to reuse portions of code, it becomes convenient, if
not necessary, to move these pieces into separate files for clarity. This is done when declaring new
classes that are used across multiple exercises and for functions whose verbosity would distract from the
point at hand.
Throughout this book, we'll maintain a file of these utility functions; it’s named utils.js. This script
contains functions that set up boilerplate code for the examples, so that you can concentrate on the
underlying animation principles. Each function is explained as they are introduced, so you don’t have to
think of this file as a black box.
In this file, many of the utility functions will be added as properties to a global JavaScript object named
utils. This way, you can avoid cluttering up the global namespace with a bunch of functions. Be sure that
at the top of the utils.js file you’ve declared an empty object like the following:
var utils = {};
To import this file and other scripts into your document, create a script element and set its src attribute
to the location of the file. Include these immediately before the example code to be certain that everything
has loaded properly before attempting to use it:
<script src="utils.js"></script>
<script>
window.onload = function () {
//Our code here...
};
</script>
4