External Controls

Im trying to make the numbered external controls demoed here:
http://sorgalla.com/projects/jcarousel/examples/static_controls.html

The only documentation Ive been able to find on this is here:
http://eoinbailey.com/blog/jcarousel-and-using-images-external-controls

I dont think I can do achieve this with the UI so Ive tried adding the following code to the beginning and end of my head, aswell as the bottom of the page.

<script type="text/javascript">
function mycarousel_initCallback(carousel) {
    jQuery('.jcarousel-control a').bind('click', function() {
        carousel.scroll(jQuery.jcarousel.intval(jQuery(this).text()));
        return false;
    });

};
</script>

Nothing works and I dont know if the code is wrong or if its to do with the way im trying to load it.
Thanks