help with php image rotation in header

I am running zen cart 1.3.8a and want to include a simple java script image rotation script into my header to run over the logo background image on the right hand side. Currently the script is in a file labeled rotate.js I think it should be done with include but am not sure as I know next to nothing about php. Can someone help me decide where to put the call and how to format it. This is a copy of the script just in case it helps.

<!-- begin code provided by createblog.com --> <script type='text/javascript'> //<![CDATA[ // // random background - jammers var image = new Array(); // change up the images here image[0] = 'images/rotation/01.jpg'; image[1] = 'images/rotation/02.jpg'; image[2] = 'images/rotation/03.jpg'; image[3] = 'images/rotation/04.jpg'; image[4] = 'images/rotation/05.jpg'; image[5] = 'images/rotation/06.jpg'; image[6] = 'images/rotation/07.jpg'; image[7] = 'images/rotation/08.jpg'; image[8] = 'images/rotation/09.jpg'; image[9] = 'images/rotation/10.jpg'; var index = Math.floor(Math.random() * image.length); document.write('<style type="text/css"> .topleftimage { background-image: url('+ image[index] +'); background-repeat: no-repeat; background-position: 0 0; border-top: 10px solid #bb7f41; border-bottom: 10px solid #bb7f41; position: absolute; left: 5%; top: 20px; width: 160px; height: 160px; z-index: 5000;} * html .topleftimage (left: 4%;}</style>');

	//]]>

</script> <!-- end code provided by createblog.com -->

Insert in proper order(probably inside of logoWrapper div) into a copy of tpl_header.php