0.46.0
Changelog
University of Adelaide Style guide

JavaScript

As mentioned in the getting started section of the style guide, when developing a website or web application you need to include the style guide artefacts into your project by visiting the style guide theme repository, or by referencing the University of Adelaide web server artefacts path.

The University of Adelaide style guide uses the following JavaScript libraries:

Please review the the above mentioned libraries for descriptions and documentation.

Both jQuery and Modernizr are compulsory JavaScript libraries that must be included within your site or web application in order for the CSS and JavaScript to work correctly.

Modernizr is used for browser feature detection and is required for both CSS and JavaScript features we use within the style guide.

The University of Adelaide has also chosen to use Yepnope in order to perform the required Modernizr tests and also as a script loader, to detect whether a component exists within the HTML and only load its dependencies when required.

For your convenience we have created a minified build of all the required functionality for use with the University of Adelaide style guide. This includes Modernizr.js, jQuery.js, yepnope.js and a series of Modernizr tests.

<script src="js/production/production.min.js"></script>

Custom build

If you require a custom build of your own script loading functionality and Modernizr tests, it is still compulsory that you must include jQuery and Modernizr for the reasons described above.

In order for you to determine which JavaScript dependency is required for a particular style guide component, you will need to review js/main.js. This file can also be viewed within the style guide theme repository.

The main.js file contains all the Yepnope script loading and Modernizr tests. You are welcome to use Yepnope in your own custom build by simply including js/contrib/yepnope/yepnope.js and also copying the content of main.js, but this is not compulsory.

By reviewing the main.js file you will be able to see exactly which Modernizr tests are required as well as see exactly which JavaScript dependencies are required for each component within the University of Adelaide style guide.

Each component within the style guide that also requires JavaScript dependencies will have a CSS class beginning with the .js-* prefix. You will be able to find this CSS class name within the HTML demo example of the component you are implementing. You can then search the main.js file and find the reference to its dependencies and any Modernizr tests.

For further assistance with your custom build, please contact the Web and Digital team.

The following scripts are compulsory when creating your own custom build of the University of Adelaide style guide JavaScript script loading and Modernizr tests:

<script src="js/contrib/modernizr/modernizr.js"></script>
<script src="js/contrib/jquery/jquery.js"></script>